mirror of
http://112.124.100.131/ebiz-ai/ebiz-ai-knowledge-manage.git
synced 2025-12-15 22:06:50 +08:00
feat(router): 添加应用管理相关路由和页面
- 在 router/index.js 中引入应用管理路由 - 新增应用管理路由配置文件 applicationManagement.js - 实现雇则风筛规则和雇则风筛记录两个页面组件 - 添加表格数据加载、查询、重置等功能- 实现新增、编辑、删除等操作的模拟
This commit is contained in:
陈昱达
29
src/router/generatedRouter/applicationManagement.js
Normal file
29
src/router/generatedRouter/applicationManagement.js
Normal file
@@ -0,0 +1,29 @@
|
|||||||
|
import layout from '@/views/app/layout/index.vue'
|
||||||
|
|
||||||
|
const applicationManagementRouter = [
|
||||||
|
{
|
||||||
|
path: '/applicationManagement',
|
||||||
|
component: layout,
|
||||||
|
redirect: '/applicationManagement/employRule',
|
||||||
|
name: 'ApplicationManagement',
|
||||||
|
meta: { title: '应用管理', icon: 'el-icon-s-management' },
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'employRule',
|
||||||
|
name: 'EmployRule',
|
||||||
|
component: () =>
|
||||||
|
import('@/views/applicationManagement/employRule/index.vue'),
|
||||||
|
meta: { title: '雇则风筛规则', icon: 'el-icon-setting' }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'employRecord',
|
||||||
|
name: 'EmployRecord',
|
||||||
|
component: () =>
|
||||||
|
import('@/views/applicationManagement/employRecord/index.vue'),
|
||||||
|
meta: { title: '雇则风筛记录', icon: 'el-icon-document' }
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
export default applicationManagementRouter
|
||||||
@@ -2,10 +2,15 @@ import Vue from 'vue'
|
|||||||
import Router from 'vue-router'
|
import Router from 'vue-router'
|
||||||
import App from './app/index'
|
import App from './app/index'
|
||||||
import generatedRouter from './generatedRouter'
|
import generatedRouter from './generatedRouter'
|
||||||
|
import applicationManagementRouter from './generatedRouter/applicationManagement'
|
||||||
|
|
||||||
Vue.use(Router)
|
Vue.use(Router)
|
||||||
|
|
||||||
export const constantRouterMap = [...App, ...generatedRouter] // 静态路由
|
export const constantRouterMap = [
|
||||||
|
...App,
|
||||||
|
...generatedRouter,
|
||||||
|
...applicationManagementRouter
|
||||||
|
] // 静态路由
|
||||||
export default new Router({
|
export default new Router({
|
||||||
mode: 'hash', //路由模式
|
mode: 'hash', //路由模式
|
||||||
base: process.env.BASE_URL,
|
base: process.env.BASE_URL,
|
||||||
|
|||||||
180
src/views/applicationManagement/employRecord/index.vue
Normal file
180
src/views/applicationManagement/employRecord/index.vue
Normal file
@@ -0,0 +1,180 @@
|
|||||||
|
<template>
|
||||||
|
<div class="render-container employ-record">
|
||||||
|
<div class="filter-container">
|
||||||
|
<div class="flex align-items-c justify-content-b">
|
||||||
|
<el-form
|
||||||
|
:model="queryParams"
|
||||||
|
label-width="100px"
|
||||||
|
label-position="top"
|
||||||
|
ref="queryParams"
|
||||||
|
inline
|
||||||
|
>
|
||||||
|
<el-form-item label="记录名称" prop="recordName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.recordName"
|
||||||
|
size="medium"
|
||||||
|
placeholder="请输入记录名称"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" size="medium">
|
||||||
|
<el-option label="全部" value=""></el-option>
|
||||||
|
<el-option
|
||||||
|
v-for="item in statusList"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
:key="item.value"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="mt15 flex align-items-c justify-content-b">
|
||||||
|
<el-button size="medium" type="primary" @click="handleQuery"
|
||||||
|
>查询</el-button
|
||||||
|
>
|
||||||
|
<el-button size="medium" @click="resetQuery">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<r-table
|
||||||
|
:columns="tableConfig.columns"
|
||||||
|
:data="tableData"
|
||||||
|
:deletion="false"
|
||||||
|
:total="tableConfig.total"
|
||||||
|
@currentChange="handleCurrentChange"
|
||||||
|
@sizeChange="handleSizeChange"
|
||||||
|
:currentPage="tableConfig.currentPage"
|
||||||
|
:pageSize="tableConfig.pageSize"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'EmployRecord',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
queryParams: {
|
||||||
|
page: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
recordName: '',
|
||||||
|
status: ''
|
||||||
|
},
|
||||||
|
statusList: [{ label: '成功', value: 0 }, { label: '失败', value: 1 }],
|
||||||
|
// 表格配置项
|
||||||
|
tableConfig: {
|
||||||
|
total: 0,
|
||||||
|
currentPage: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
columns: [
|
||||||
|
{ prop: 'recordName', key: '记录名称' },
|
||||||
|
{ prop: 'recordDesc', key: '记录描述' },
|
||||||
|
{ prop: 'createTime', key: '创建时间' },
|
||||||
|
{
|
||||||
|
prop: 'status',
|
||||||
|
key: '状态',
|
||||||
|
render: (h, params) => {
|
||||||
|
return h(
|
||||||
|
'el-tag',
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: params.row.status === 0 ? 'success' : 'danger',
|
||||||
|
size: 'small'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
params.row.status === 0 ? '成功' : '失败'
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '操作',
|
||||||
|
isRedraw: true,
|
||||||
|
render: (h, params) => {
|
||||||
|
return h('div', [
|
||||||
|
h(
|
||||||
|
'el-button',
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: 'text',
|
||||||
|
size: 'mini',
|
||||||
|
icon: 'el-icon-view',
|
||||||
|
title: '查看'
|
||||||
|
},
|
||||||
|
class: 'normal-button',
|
||||||
|
on: { click: () => this.handleView(params.row) }
|
||||||
|
},
|
||||||
|
''
|
||||||
|
)
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
tableData: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取列表
|
||||||
|
getList() {
|
||||||
|
this.loading = true
|
||||||
|
// 这里应该调用实际的API接口
|
||||||
|
// 模拟数据
|
||||||
|
setTimeout(() => {
|
||||||
|
this.tableData = [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
recordName: '记录1',
|
||||||
|
recordDesc: '记录描述1',
|
||||||
|
createTime: '2023-01-01 12:00:00',
|
||||||
|
status: 0
|
||||||
|
}
|
||||||
|
]
|
||||||
|
this.tableConfig.total = 1
|
||||||
|
this.loading = false
|
||||||
|
}, 500)
|
||||||
|
},
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.page = 1
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
resetQuery() {
|
||||||
|
this.$refs.queryParams.resetFields()
|
||||||
|
this.handleQuery()
|
||||||
|
},
|
||||||
|
handleView(row) {
|
||||||
|
this.$message.info('查看详情功能待实现')
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.queryParams.pageSize = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
this.queryParams.page = val
|
||||||
|
this.getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.employ-record {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.filter-container {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.el-form-item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
|
||||||
|
.el-form-item__label {
|
||||||
|
padding-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
225
src/views/applicationManagement/employRule/index.vue
Normal file
225
src/views/applicationManagement/employRule/index.vue
Normal file
@@ -0,0 +1,225 @@
|
|||||||
|
<template>
|
||||||
|
<div class="render-container employ-rule">
|
||||||
|
<div class="filter-container">
|
||||||
|
<div class="flex align-items-c justify-content-b">
|
||||||
|
<el-form
|
||||||
|
:model="queryParams"
|
||||||
|
label-width="100px"
|
||||||
|
label-position="top"
|
||||||
|
ref="queryParams"
|
||||||
|
inline
|
||||||
|
>
|
||||||
|
<el-form-item label="规则名称" prop="ruleName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.ruleName"
|
||||||
|
size="medium"
|
||||||
|
placeholder="请输入规则名称"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" size="medium">
|
||||||
|
<el-option label="全部" value=""></el-option>
|
||||||
|
<el-option
|
||||||
|
v-for="item in statusList"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
:key="item.value"
|
||||||
|
></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="mt15 flex align-items-c justify-content-b">
|
||||||
|
<el-button size="medium" type="primary" @click="handleQuery"
|
||||||
|
>查询</el-button
|
||||||
|
>
|
||||||
|
<el-button size="medium" @click="resetQuery">重置</el-button>
|
||||||
|
<el-button size="medium" type="primary" @click="handleAdd"
|
||||||
|
>新增</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<r-table
|
||||||
|
:columns="tableConfig.columns"
|
||||||
|
:data="tableData"
|
||||||
|
:deletion="false"
|
||||||
|
:total="tableConfig.total"
|
||||||
|
@currentChange="handleCurrentChange"
|
||||||
|
@sizeChange="handleSizeChange"
|
||||||
|
:currentPage="tableConfig.currentPage"
|
||||||
|
:pageSize="tableConfig.pageSize"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'EmployRule',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
queryParams: {
|
||||||
|
page: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
ruleName: '',
|
||||||
|
status: ''
|
||||||
|
},
|
||||||
|
statusList: [{ label: '启用', value: 0 }, { label: '停用', value: 1 }],
|
||||||
|
// 表格配置项
|
||||||
|
tableConfig: {
|
||||||
|
total: 0,
|
||||||
|
currentPage: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
columns: [
|
||||||
|
{ prop: 'ruleName', key: '规则名称' },
|
||||||
|
{ prop: 'ruleDesc', key: '规则描述' },
|
||||||
|
{ prop: 'createTime', key: '创建时间' },
|
||||||
|
{
|
||||||
|
prop: 'status',
|
||||||
|
key: '状态',
|
||||||
|
render: (h, params) => {
|
||||||
|
return h(
|
||||||
|
'el-tag',
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: params.row.status === 0 ? 'success' : 'danger',
|
||||||
|
size: 'small'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
params.row.status === 0 ? '启用' : '停用'
|
||||||
|
)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '操作',
|
||||||
|
isRedraw: true,
|
||||||
|
render: (h, params) => {
|
||||||
|
return h('div', [
|
||||||
|
h(
|
||||||
|
'el-button',
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: 'text',
|
||||||
|
size: 'mini',
|
||||||
|
icon: 'el-icon-edit-outline',
|
||||||
|
title: '编辑'
|
||||||
|
},
|
||||||
|
class: 'normal-button',
|
||||||
|
on: { click: () => this.handleEdit(params.row) }
|
||||||
|
},
|
||||||
|
''
|
||||||
|
),
|
||||||
|
h(
|
||||||
|
'el-button',
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: 'text',
|
||||||
|
size: 'mini',
|
||||||
|
icon:
|
||||||
|
params.row.status === 0
|
||||||
|
? 'el-icon-remove-outline'
|
||||||
|
: 'el-icon-circle-check',
|
||||||
|
title: params.row.status === 0 ? '停用' : '启用'
|
||||||
|
},
|
||||||
|
on: { click: () => this.handleToggleStatus(params.row) }
|
||||||
|
}
|
||||||
|
),
|
||||||
|
h('el-button', {
|
||||||
|
props: {
|
||||||
|
type: 'text',
|
||||||
|
size: 'mini',
|
||||||
|
style: 'color: #F56C6C',
|
||||||
|
icon: 'el-icon-delete',
|
||||||
|
title: '删除'
|
||||||
|
},
|
||||||
|
on: { click: () => this.handleDelete(params.row) }
|
||||||
|
})
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
tableData: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取列表
|
||||||
|
getList() {
|
||||||
|
this.loading = true
|
||||||
|
// 这里应该调用实际的API接口
|
||||||
|
// 模拟数据
|
||||||
|
setTimeout(() => {
|
||||||
|
this.tableData = [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
ruleName: '规则1',
|
||||||
|
ruleDesc: '规则描述1',
|
||||||
|
createTime: '2023-01-01 12:00:00',
|
||||||
|
status: 0
|
||||||
|
}
|
||||||
|
]
|
||||||
|
this.tableConfig.total = 1
|
||||||
|
this.loading = false
|
||||||
|
}, 500)
|
||||||
|
},
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.page = 1
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
resetQuery() {
|
||||||
|
this.$refs.queryParams.resetFields()
|
||||||
|
this.handleQuery()
|
||||||
|
},
|
||||||
|
handleAdd() {
|
||||||
|
this.$message.info('新增功能待实现')
|
||||||
|
},
|
||||||
|
handleEdit(row) {
|
||||||
|
this.$message.info('编辑功能待实现')
|
||||||
|
},
|
||||||
|
handleToggleStatus(row) {
|
||||||
|
this.$message.info('状态切换功能待实现')
|
||||||
|
},
|
||||||
|
handleSizeChange(val) {
|
||||||
|
this.queryParams.pageSize = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleCurrentChange(val) {
|
||||||
|
this.queryParams.page = val
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
handleDelete(row) {
|
||||||
|
this.$messageBox(
|
||||||
|
() => {
|
||||||
|
this.$message.success('删除成功')
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
'确认删除该规则吗？',
|
||||||
|
'warning',
|
||||||
|
'警告'
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.employ-rule {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.filter-container {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.el-form-item {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
|
||||||
|
.el-form-item__label {
|
||||||
|
padding-right: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user