Files
test/test-ui/src/views/test/performance/performance.vue
2025-06-16 15:04:04 +08:00

142 lines
3.8 KiB
Vue

<template>
<div class="performance">
<div class="header">
<el-button icon="el-icon-circle-plus-outline" @click="addTest">创建测试</el-button>
<div class="search">
<el-input v-model="serachForm.performanceName" placeholder="根据名称搜索"></el-input>
<el-button type="text" style="margin-left: 10px;" @click="serachList">高级搜索</el-button>
</div>
</div>
<el-divider></el-divider>
<div class="table">
<el-table :data="data">
<el-table-column type="selection" width="55" />
<el-table-column prop="id" label="ID" width="50" align="center" />
<el-table-column prop="performanceName" label="名称" width="150" align="center" />
<el-table-column prop="createBy" label="创建人" width="100" sortable align="center" />
<el-table-column prop="createTime" label="创建时间" sortable align="center" />
<el-table-column prop="updateTime" label="更新时间" sortable align="center" />
<el-table-column prop="status" label="状态" width="50" align="center">
<template slot-scope="scope">
<div v-if="scope.row.status === '0'"></div>
<div v-else></div>
</template>
</el-table-column>
<el-table-column prop="action" label="操作" align="center">
<template slot-scope="scope">
<el-button type="text" icon="el-icon-edit-outline" @click="hadleClickEdit(scope.row)">编辑</el-button>
<el-button type="text" icon="el-icon-delete" style="color: red;"
@click="hadleClickDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="page">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
:page-size="serachForm.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total" />
</div>
</div>
</div>
</template>
<script>
import { getPerfromanceList, deleteTest } from '../../../api/performance'
export default {
name: "Performance",
data() {
return {
data: [],
serachForm: {
pageNum: 1,
pageSize: 10,
performanceName: '', // 名称
},
total: 0,
}
},
mounted() {
this.getPerformaceData()
},
activated() {
this.getPerformaceData()
},
methods: {
// 创建测试
addTest() {
this.$tab.openPage("新增测试", "/performance/add");
},
// 高级搜索
serachList() {
this.getPerformaceData()
},
// 编辑
hadleClickEdit(val) {
this.$tab.openPage(`修改测试_${val.id}`, `/performance/edit/${val.id}`, { id: val.id });
},
// 删除
hadleClickDelete(val) {
deleteTest(String(val.id)).then(res => {
if (res.code === 200) {
this.$message({ message: '删除成功', type: 'success' })
this.getPerformaceData()
} else {
this.$message({ message: '删除失败', type: 'error' })
}
})
},
// 分页
handleSizeChange(val) {
this.serachForm.pageSize = val
this.getPerformaceData()
},
handleCurrentChange(val) {
this.serachForm.pageNum = val
this.getPerformaceData()
},
// networking
// 获取测试列表
getPerformaceData() {
getPerfromanceList(this.serachForm).then(res => {
if (res.code === 200) {
this.data = res.rows
this.total = res.total
}
})
},
}
}
</script>
<style scoped lang="scss">
.performance {
padding: 10px;
.header {
display: flex;
justify-content: space-between;
padding: 10px;
}
.search {
display: flex;
}
.page {
padding: 10px;
display: flex;
justify-content: flex-end;
}
}
::v-deep .el-divider--horizontal {
display: block;
height: 1px;
width: 100%;
margin: 10px 0;
}
</style>