feat: codeList认领功能添加

frontend/src/App.vue

@@ -29,7 +29,8 @@
             <h3 class="header-content"><el-icon class="header-icon"><Guide /></el-icon>剑鱼可视化爬虫开发平台 v1.0</h3>
           </el-col>
           <el-col :span="10" style="padding:15px;text-align: right;" v-if="showLogoutModule">
-            <span>当前用户: {{ userName }} / {{ userRole }} &nbsp;</span>
+            <!-- <span>当前用户: {{ userName }} / {{ userRole }} &nbsp;</span> -->
+            <span>当前用户: {{ userName }} &nbsp;</span>
             <el-button type="danger" @click="doLogout"><el-icon>
               <SwitchButton />
             </el-icon></el-button>

frontend/src/composables/filter-options.js

@@ -0,0 +1,27 @@
+import { spiderStateOptions, spiderClaimOptions } from '../data'
+import { useStore } from 'vuex'
+
+function checkFilterPower(list = [], role = '') {
+  return list.filter(s => {
+    if (Array.isArray(s.role)) {
+      if (s.role.length > 0) {
+        return s.role.includes(role)
+      } else {
+        return true
+      }
+    } else {
+      return true
+    }
+  })
+}
+
+export default function useCodeListFiltersWithRole() {
+  const store = useStore()
+  const role = store.getters.userRole
+  const stateOptions = checkFilterPower(spiderStateOptions, role)
+  const claimOptions = checkFilterPower(spiderClaimOptions, role)
+  return {
+    stateOptions,
+    claimOptions,
+  }
+}

frontend/src/data/filters.js

@@ -0,0 +1,53 @@
+import { USER_ROLE_ADMIN, USER_ROLE_DEVELOPER, USER_ROLE_REVIEWER } from './user'
+// codeList备选项
+export const spiderStateOptions = [
+  {
+    label: '全部',
+    value: -1,
+  },
+  {
+    label: '待完成',
+    value: 0,
+  },
+  {
+    label: '待审核',
+    value: 1,
+  },
+  {
+    label: '未通过',
+    value: 2,
+  },
+  {
+    label: '已通过',
+    value: 3,
+  },
+  {
+    label: '已上线',
+    value: 11,
+  },
+  {
+    label: '无法标注',
+    value: 12,
+  },
+]
+
+export const spiderClaimOptions = [
+  {
+    label: '全部',
+    value: -1,
+    role: [],
+  },
+  {
+    label: '待认领',
+    value: 0,
+    role: [USER_ROLE_ADMIN, USER_ROLE_REVIEWER],
+  },
+  {
+    label: '已认领',
+    value: 1,
+  },
+  {
+    label: '历史爬虫',
+    value: 2,
+  },
+]

frontend/src/data/index.js

@@ -1 +1,2 @@
-export * from './user'
+export * from './user'
+export * from './filters'

frontend/src/store/modules/rulesList.js

@@ -1,4 +1,8 @@
-import { ServerActionCodeList, ServerActionGetModifyUsers } from '../../../wailsjs/go/main/App'
+import {
+  ServerActionCodeList,
+  ServerActionGetModifyUsers,
+  ServerActionClaimCodes,
+} from '../../../wailsjs/go/main/App'
 
 // 爬虫列表模块(局部模块)
 export default {
@@ -29,18 +33,23 @@ export default {
       const r = await ServerActionCodeList({
         modifyuser: payload.modifyuser, // 维护人
         state: payload.state, // 爬虫状态
-        claim: payload.claim, // 认领状态
+        claimtype: payload.claimtype, // 认领状态
         search: payload.search, // 搜索内容
         start: (pageNum - 1) * pageSize,
         limit: pageSize
       })
       return r
     },
+    // 爬虫认领
+    async userClaimCodes() {
+      const r = await ServerActionClaimCodes()
+      return r
+    },
     // 获取维护人列表
     async getModifyUserList() {
       const r = await ServerActionGetModifyUsers()
       return r
-    }
+    },
   },
   getters: {}
 }

frontend/src/views/CodeList.vue

@@ -8,17 +8,19 @@
                     <el-button size="small" type="success" @click="resetFilterAndRefreshTableList">
                         刷新
                     </el-button>
+                    <el-button size="small" type="success" @click="userClaimCodes" v-if="showRenLingButton">
+                        认领
+                    </el-button>
                 </el-space>
                 <el-space class="action-bar-item-container action-bar-action-right">
-                    <div class="action-bar-item">
+                    <div class="action-bar-item" v-if="showModifyUserFilter">
                         <span class="action-bar-name">维护人：</span>
-                        <el-select v-model="filters.modifyuser" placeholder="维护人" style="width: 140px" @change="onModifyUserSelectChange">
+                        <el-select v-model="filters.modifyuser" style="width: 140px" @change="onModifyUserSelectChange">
                             <el-option
                                 v-for="item in filterConfig.modifyUserList"
                                 :key="item.value"
                                 :label="item.label"
                                 :value="item.value"
-                                
                             />
                         </el-select>
                     </div>
@@ -35,7 +37,7 @@
                     </div>
                     <div class="action-bar-item">
                         <span class="action-bar-name">认领状态：</span>
-                        <el-select v-model="filters.state" placeholder="认领状态" style="width: 140px" @change="onClaimSelectChange">
+                        <el-select v-model="filters.claimtype" placeholder="认领状态" style="width: 140px" @change="onClaimSelectChange">
                             <el-option
                                 v-for="item in filterConfig.claimOptions"
                                 :key="item.value"
@@ -59,9 +61,30 @@
                 <el-table-column prop="claimText" label="认领状态" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="href" label="栏目地址" show-overflow-tooltip></el-table-column>
                 <el-table-column prop="modifyuser" label="维护人" width="80" show-overflow-tooltip></el-table-column>
-                <el-table-column label="操作" width="200">
+                <el-table-column label="操作" width="160">
                     <template #default="scope">
-                        <el-button size="small" type="success" @click="tableEvents.handleDataTag(scope.$index, scope.row)">
+                        <el-tooltip content="标注" placement="top">
+                            <el-button size="small" @click="tableEvents.handleDataTag(scope.$index, scope.row)">
+                                <el-icon>
+                                    <SetUp />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="编辑" placement="top">
+                            <el-button size="small" @click="tableEvents.handleEdit(scope.$index, scope.row)">
+                                <el-icon>
+                                    <Edit />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="调试" placement="top">
+                            <el-button size="small" @click="tableEvents.handleDebug(scope.$index, scope.row)">
+                                <el-icon>
+                                    <Promotion />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <!-- <el-button size="small" type="success" @click="tableEvents.handleDataTag(scope.$index, scope.row)">
                             标注
                         </el-button>
                         <el-button size="small" type="warning" @click="tableEvents.handleEdit(scope.$index, scope.row)">
@@ -69,7 +92,32 @@
                         </el-button>
                         <el-button size="small" type="danger" @click="tableEvents.handleDebug(scope.$index, scope.row)">
                             调试
-                        </el-button>
+                        </el-button> -->
+                    </template>
+                </el-table-column>
+                <el-table-column label="功能" width="160">
+                    <template #default="scope">
+                        <el-tooltip content="验证" placement="top">
+                            <el-button size="small" @click="tableEvents.handleDataTag(scope.$index, scope.row)">
+                                <el-icon>
+                                    <SetUp />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="提交" placement="top">
+                            <el-button size="small" @click="tableEvents.handleEdit(scope.$index, scope.row)">
+                                <el-icon>
+                                    <Edit />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
+                        <el-tooltip content="回退" placement="top">
+                            <el-button size="small" @click="tableEvents.handleDebug(scope.$index, scope.row)">
+                                <el-icon>
+                                    <Promotion />
+                                </el-icon>
+                            </el-button>
+                        </el-tooltip>
                     </template>
                 </el-table-column>
             </el-table>
@@ -95,66 +143,24 @@ import { SaveOrUpdateSpiderConfig } from "../../wailsjs/go/main/App"
 import { SwitchSpiderConfig } from "../../wailsjs/go/main/App"
 import Navigator from "../components/Navigator.vue"
 import EditSpider from "../components/EditSpider.vue"
+import useCodeListFiltersWithRole from '../composables/filter-options'
+import { USER_ROLE_ADMIN, USER_ROLE_DEVELOPER, USER_ROLE_REVIEWER } from '../data/user'
 
 const router = useRouter();
 const store = useStore();
 const spiderTable = ref(null)
 
+const { stateOptions, claimOptions } = useCodeListFiltersWithRole()
+
 const filterConfig = reactive({
     // 爬虫状态
-    stateOptions: [
-        {
-            label: '全部',
-            value: -1,
-        },
-        {
-            label: '待完成',
-            value: 0,
-        },
-        {
-            label: '待审核',
-            value: 1,
-        },
-        {
-            label: '未通过',
-            value: 2,
-        },
-        {
-            label: '已通过',
-            value: 3,
-        },
-        {
-            label: '已上线',
-            value: 11,
-        },
-        {
-            label: '无法标注',
-            value: 12,
-        },
-    ],
-    claimOptions: [
+    stateOptions: stateOptions,
+    claimOptions: claimOptions,
+    modifyUserList: [
         {
             label: '全部',
-            value: -1
-        },
-        {
-            label: '待认领',
-            value: 0
-        },
-        {
-            label: '已认领',
-            value: 1
-        },
-        {
-            label: '历史爬虫',
-            value: 2
-        },
-    ],
-    modifyUserList: [
-        // {
-        //     label: '全部',
-        //     value: ''
-        // }
+            value: '-1',
+        }
     ]
 })
 
@@ -162,15 +168,15 @@ const filterConfig = reactive({
 const filters = reactive({
     search: '',
     state: -1,
-    modifyuser: '',
-    claim: -1,
+    modifyuser: '-1',
+    claimtype: -1,
 })
 // 选择器数据(用来重置)
 const defaultFilters = {
     search: '',
     state: -1,
-    modifyuser: '',
-    claim: -1,
+    modifyuser: '-1',
+    claimtype: -1,
 }
 
 // 列表数据
@@ -201,6 +207,11 @@ const defaultListState = {
     list: [],
 }
 
+const userRole = computed(() => store.getters.userRole)
+const showModifyUserFilter = computed(() => [USER_ROLE_ADMIN, USER_ROLE_REVIEWER].includes(userRole.value))
+const showRenLingButton = computed(() => [USER_ROLE_DEVELOPER].includes(userRole.value))
+
+
 const editSpiderDialog = ref(null)
 
 const dialogEvents = {
@@ -278,7 +289,7 @@ const getTableList = async () => {
             modifyuser: filters.modifyuser, // 维护人
             state: filters.state, // 爬虫状态
             search: filters.search, // 搜索内容
-            claim: filters.claim,
+            claimtype: filters.claimtype,
             pageSize: listState.pageSize,
             pageNum: listState.pageNum
         });
@@ -325,6 +336,34 @@ const resetFilterAndRefreshTableList = () => {
     refreshTableList()
 }
 
+// 认领
+const userClaimCodes = async () => {
+    try {
+        const r = await store.dispatch('rulesList/userClaimCodes')
+        const { msg, err } = r
+        if (err === 0) {
+            ElMessage({
+                message: msg || '认领成功',
+                showClose: true,
+                duration: 3000,
+            })
+            resetFilterAndRefreshTableList()
+        } else {
+            ElMessage({
+                message: msg || '认领失败',
+                showClose: true,
+                duration: 3000,
+            })
+        }
+    } catch (error) {
+        ElMessage({
+            message: '认领失败',
+            showClose: true,
+            duration: 3000,
+        })
+    }
+}
+
 getTableList()
 
 const handleSizeChange = (val) => {
@@ -343,7 +382,7 @@ const getModifyUserList = async () => {
     const { data, code } = r
     if (data) {
         if (Array.isArray(data.list)) {
-            const arr = [{ name: '全部', value: '' }]
+            const arr = filterConfig.modifyUserList
             const reqArr = data.list.map(r => {
                 return {
                     label: r.s_name,