区域筛选

src/views/OperatorView.vue

@@ -2,6 +2,14 @@
     <PagingTable url="/operator-config" :where="where" ref="table" :order="{ country: 'ASC' }">
         <template #filter>
             <ElButton :icon="Refresh" @click="table.refresh()"></ElButton>
+            <ElSelect v-model="area" placeholder="区域" clearable @change="updateWhereAndRefresh">
+                <ElOption
+                    v-for="area in areas"
+                    :key="area.value"
+                    :label="area.value"
+                    :value="area.value"
+                />
+            </ElSelect>
             <ElButton
                 :icon="Plus"
                 @click="
@@ -115,6 +123,49 @@ const platformList = [
         value: 'durian'
     }
 ]
+const area = ref(null)
+const areas = [
+    {
+        value: '欧洲'
+    },
+    {
+        value: '北美洲'
+    },
+    {
+        value: '中美洲'
+    },
+    {
+        value: '南美洲'
+    },
+    {
+        value: '非洲'
+    },
+    {
+        value: '中东'
+    },
+    {
+        value: '亚洲'
+    },
+    {
+        value: '东南亚'
+    },
+    {
+        value: '阿拉伯半岛'
+    },
+    {
+        value: '加勒比海'
+    },
+    {
+        value: '太平洋'
+    }
+]
+
+function updateWhereAndRefresh() {
+    where.value = {}
+    if (area.value) {
+        where.value.area = area.value
+    }
+}
 
 const { showEditDialog, onEdit } = setupEditDialog(model)