feat: add miner and include filters to win page

graph/loaders/mining.go

@@ -85,7 +85,7 @@ GROUP BY
 	return result, nil
 }
 
-func (l *Loader) MiningTasks(ctx context.Context, actor *types.ActorID, won *bool, offset int, limit int) ([]*model.MiningTask, error) {
+func (l *Loader) MiningTasks(ctx context.Context, actor *types.ActorID, won *bool, include bool, offset int, limit int) ([]*model.MiningTask, error) {
 	var result []*model.MiningTask
 
 	err := l.db.Select(ctx, &result, `
@@ -104,14 +104,14 @@ FROM
     mining_tasks
 WHERE
     ($1::bool IS NULL OR won = $1) AND
-    ($2::int IS NULL OR sp_id = $2)
+    ($2::int IS NULL OR sp_id = $2) AND
+    included = $3
 ORDER BY
     base_compute_time DESC 
-LIMIT $3 OFFSET $4;`, won, actor, limit, offset)
+LIMIT $4 OFFSET $5;`, won, actor, include, limit, offset)
 
 	if err != nil {
 		return nil, err
 	}
-	fmt.Println(result)
 	return result, nil
 }

graph/schema/query.graphql

@@ -44,7 +44,7 @@ type Query {
 #    miningSummaryByDay(lastDays: Int!): [MiningSummaryDay]
     miningSummaryByDay(start: Time!, end: Time!): [MiningSummaryDay]
     miningCount(start: Time!, end: Time!, actor: ActorID): MiningCount!
-    miningWins(actor: ActorID, include: Boolean, offset: Int!, limit: Int!): [MiningTask]
+    miningWins(actor: ActorID, include: Boolean!, offset: Int!, limit: Int!): [MiningTask]
 
     dealsPending: [OpenSectorPiece]
 

ui/src/components.d.ts

@@ -11,6 +11,7 @@ declare module 'vue' {
     BaseBreadcrumb: typeof import('./components/shared/BaseBreadcrumb.vue')['default']
     CardHeader: typeof import('./components/shared/CardHeader.vue')['default']
     HelloWorld: typeof import('./components/HelloWorld.vue')['default']
+    MinerSelectInput: typeof import('./components/app/MinerSelectInput.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     StoragePathTable: typeof import('./components/app/StoragePathTable.vue')['default']

ui/src/components/app/MinerSelectInput.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import { useQuery } from '@vue/apollo-composable'
+import { computed, ComputedRef } from 'vue'
+import { Actor } from '@/typed-graph'
+import { GetActorAddresses } from '@/gql/actor'
+
+const emit = defineEmits(['update:modelValue'])
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: undefined,
+  },
+  label: {
+    type: String,
+    default: 'Miner',
+  },
+})
+
+const { result, loading } = useQuery(GetActorAddresses, null, () => ({
+  fetchPolicy: 'cache-first',
+}))
+
+const miners: ComputedRef<[Actor]> = computed(() => result.value?.actors || [])
+
+const localValue = computed({
+  get () {
+    return props.modelValue
+  },
+  set (value) {
+    emit('update:modelValue', value)
+  },
+})
+</script>
+
+<template>
+  <v-autocomplete
+    v-model="localValue"
+    clearable
+    color="primary"
+    density="compact"
+    :disabled="loading"
+    item-title="address"
+    :items="miners"
+    :label="props.label"
+    role="link"
+    single-line
+    variant="outlined"
+  />
+</template>
+
+<style scoped lang="scss">
+
+</style>

ui/src/gql/actor.ts

@@ -0,0 +1,10 @@
+import gql from 'graphql-tag'
+
+export const GetActorAddresses = gql`
+    query GetActorAddresses {
+      actors {
+        id
+        address
+      }
+    }
+`

ui/src/gql/mining.ts

@@ -35,7 +35,7 @@ export const GetMiningBlockCount = gql`
 `
 
 export const GetMiningWins = gql`
-    query GetMiningWins($miner: ActorID, $include: Boolean, $offset: Int!, $limit: Int!) {
+    query GetMiningWins($miner: ActorID, $include: Boolean!, $offset: Int!, $limit: Int!) {
         miningWins(actor: $miner, include: $include, offset: $offset, limit: $limit) {
             ...MiningTaskAll
         }

ui/src/gql/sector.ts

@@ -52,9 +52,6 @@ export const GetSectors = gql`
       }
     }
     sectorsCount(actor: $miner)
-    actors {
-      address
-    }
   }
   ${metaFragment}
   ${locationPrimaryFragment}

ui/src/typed-graph.d.ts

@@ -476,7 +476,7 @@ export type QueryMiningSummaryByDayArgs = {
 
 export type QueryMiningWinsArgs = {
   actor?: InputMaybe<Scalars['ActorID']['input']>;
-  include?: InputMaybe<Scalars['Boolean']['input']>;
+  include: Scalars['Boolean']['input'];
   limit: Scalars['Int']['input'];
   offset: Scalars['Int']['input'];
 };

ui/src/views/auth/LoginForm.vue

@@ -11,7 +11,6 @@ const authStore = useAuthStore()
 
 function submit () {
   authStore.login(username.value, password.value).then(() => {
-    console.log('Logged in')
     authError.value = ''
   }).catch(error => {
     authError.value = error

ui/src/views/machines/MachineList.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, ComputedRef, ref, watch } from 'vue'
+import { computed, ComputedRef, ref } from 'vue'
 import moment from 'moment'
 import { EyeOutlined, SearchOutlined } from '@ant-design/icons-vue'
 import { IconReload } from '@tabler/icons-vue'
@@ -36,10 +36,6 @@ const searchValue = ref('')
 const selectLayer = ref(null)
 const selectSupportTask = ref(null)
 
-watch(selectSupportTask, () => {
-  console.log(selectSupportTask.value)
-})
-
 const filterItems = computed(() => {
   return items.value.filter(item => {
     if (selectLayer.value && !item.detail?.layers.includes(selectLayer.value)) {

ui/src/views/mining/wins/MiningTaskList.vue

@@ -1,27 +1,39 @@
 <script setup lang="ts">
 import { useLazyQuery } from '@vue/apollo-composable'
-import { computed, ComputedRef, ref } from 'vue'
+import { computed, ComputedRef, ref, watch } from 'vue'
 import { MiningTask } from '@/typed-graph'
 import { GetMiningWins } from '@/gql/mining'
-import { IconInfoCircle, IconReload, IconSearch } from '@tabler/icons-vue'
+import { IconInfoCircle } from '@tabler/icons-vue'
+import { useCustomizerStore } from '@/stores/customizer'
+
+const customizer = useCustomizerStore()
 
 const offset = ref(0)
 const limit = ref(100)
-const spId = ref()
+const selectMiner = ref<string | undefined>(undefined)
 const include = ref(true)
 
-const { result, load, refetch, error } = useLazyQuery(GetMiningWins, {
-  miner: spId,
+const { result, load, loading, refetch, error } = useLazyQuery(GetMiningWins, {
+  miner: selectMiner,
   include,
-  limit,
   offset,
+  limit,
 }, () => ({
   fetchPolicy: 'cache-first',
 }))
 
 const items = ref<MiningTask[]>([])
 const current: ComputedRef<[MiningTask]> = computed(() => result.value?.miningWins || [])
 
+watch([selectMiner, include], async () => {
+  offset.value = 0
+  await refetch()
+  while (loading.value) {
+    await new Promise(resolve => setTimeout(resolve, 500))
+  }
+  items.value = current.value
+}, { flush: 'post' })
+
 const headers = [
   { title: 'ID', key: 'taskId' },
   { title: 'Miner', key: 'spId' },
@@ -40,6 +52,11 @@ async function onLoad ({ side, done }: { side: InfiniteScrollSide, done: (status
   if (side === 'end') {
     await load()
   }
+
+  while (loading.value) {
+    await new Promise(resolve => setTimeout(resolve, 500))
+  }
+
   if (error.value) {
     done('error')
     return
@@ -48,50 +65,31 @@ async function onLoad ({ side, done }: { side: InfiniteScrollSide, done: (status
   if (!current.value.length) {
     done('empty')
   } else {
-    items.value.push(...current.value)
+    items.value = [...items.value, ...current.value]
     offset.value += current.value.length
     done('ok')
   }
 }
 
-const searchValue = ref('')
 </script>
 
 <template>
-  <v-card class="bg-surface" elevation="0" variant="outlined">
+  <v-card class="bg-surface" elevation="0" :loading="loading" variant="outlined">
     <v-card-item>
       <v-row class="align-center" justify="space-between">
-        <v-col cols="12" md="3">
-          <v-text-field
-            v-model="searchValue"
-            hide-details
-            persistent-placeholder
-            placeholder="Search"
-            type="text"
-            variant="outlined"
-          >
-            <template #prepend-inner>
-              <IconSearch :size="14" />
-            </template>
-          </v-text-field>
+        <v-col cols="6" md="2">
+          <MinerSelectInput v-model="selectMiner" />
         </v-col>
-        <v-col cols="12" md="3">
-          <div class="d-flex ga-2 justify-end">
-            <v-btn
-              :icon="IconReload"
-              round
-              rounded
-              variant="text"
-              @click="refetch"
-            />
-          </div>
+        <v-col cols="6" md="3">
+          <v-switch v-model="include" color="primary" :disabled="loading" label="Include" />
         </v-col>
+        <v-spacer />
       </v-row>
     </v-card-item>
     <v-divider />
     <v-card-text class="pa-0">
       <v-infinite-scroll height="calc(100vh - 250px)" @load="onLoad">
-        <v-table hover theme="dark">
+        <v-table hover :theme="customizer.dark ? 'dark' : 'light'">
           <thead>
             <tr>
               <th v-for="h in headers" :key="h.key" class="text-left">