|
|
@@ -1,5 +1,18 @@
|
|
|
<template>
|
|
|
<div class="business-scene">
|
|
|
+ <el-card class="mb-3 proCard">
|
|
|
+ <el-space align="center">
|
|
|
+ <el-input
|
|
|
+ :style="{ width: '320px' }"
|
|
|
+ clearable
|
|
|
+ v-model="searchKey"
|
|
|
+ placeholder="请输入关键字"
|
|
|
+ @keyup.enter="handleSearch"
|
|
|
+ />
|
|
|
+ <el-button type="primary" :icon="Search" @click="handleSearch">查询</el-button>
|
|
|
+ </el-space>
|
|
|
+ </el-card>
|
|
|
+
|
|
|
<header class="header">
|
|
|
<el-button class="header__button" type="primary" :icon="Plus"
|
|
|
@click="openDrawer('添加业务场景')">添加业务场景</el-button>
|
|
|
@@ -21,7 +34,7 @@
|
|
|
<script lang="ts" setup>
|
|
|
import { onMounted, ref, h, reactive } from 'vue';
|
|
|
import { ElTag } from 'element-plus';
|
|
|
-import { Plus } from '@element-plus/icons-vue'
|
|
|
+import { Plus, Search } from '@element-plus/icons-vue'
|
|
|
import { BasicTable } from '@/components/Table';
|
|
|
import { useTableHook } from './useTableHook.ts';
|
|
|
import { SceneListInfo } from '@/types/business-scene/type.ts'
|
|
|
@@ -32,6 +45,7 @@ import Up from '@/assets/icons/up.png';
|
|
|
import Down from '@/assets/icons/down.png';
|
|
|
import Edit from '@/assets/icons/edit.png';
|
|
|
import Delete from '@/assets/icons/delete.png';
|
|
|
+
|
|
|
const { orderNums, tableData, getTableData, deleteTableData, sortTableData } = useTableHook()
|
|
|
const drawerVisiable = ref(false);
|
|
|
const drawerTitle = ref('添加业务场景')
|
|
|
@@ -137,6 +151,12 @@ const actionColumn: BasicColumn = reactive({
|
|
|
});
|
|
|
},
|
|
|
});
|
|
|
+
|
|
|
+const searchKey = ref();
|
|
|
+const handleSearch = () => {
|
|
|
+ if (searchKey.value === '') return getTableData();
|
|
|
+ tableData.value = tableData.value.filter(item => item.name.includes(searchKey.value))
|
|
|
+}
|
|
|
onMounted(() => {
|
|
|
getTableData();
|
|
|
})
|