You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

437 lines
15 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="功能模块" prop="moduleCode">
<el-select v-model="queryParams.moduleCode" placeholder="请选择功能模块" clearable>
<el-option
v-for="dict in dict.type.module_code"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="提示类型" prop="pointType">
<el-select v-model="queryParams.pointType" placeholder="请选择提示类型" clearable>
<el-option
v-for="dict in dict.type.point_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<!-- <el-form-item label="路由地址" prop="routerAddress">-->
<!-- <el-input-->
<!-- v-model="queryParams.routerAddress"-->
<!-- placeholder="请输入路由地址"-->
<!-- clearable-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<!-- <el-form-item label="路由地址详情" prop="routerAddressDetail">-->
<!-- <el-input-->
<!-- v-model="queryParams.routerAddressDetail"-->
<!-- placeholder="请输入路由地址详情"-->
<!-- clearable-->
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="跳转标识" prop="routerFlag">
<el-select v-model="queryParams.routerFlag" placeholder="请选择跳转标识" clearable>
<el-option
v-for="dict in dict.type.router_flag"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="daterangecreateTime"
style="width: 340px"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetimerange"
range-separator="-"
start-placeholder="开始时间"
end-placeholder="结束时间"
></el-date-picker>
</el-form-item>
<!-- <el-form-item label="更新时间">-->
<!-- <el-date-picker-->
<!-- v-model="daterangeupdateTime"-->
<!-- style="width: 240px"-->
<!-- value-format="yyyy-MM-dd"-->
<!-- type="daterange"-->
<!-- range-separator="-"-->
<!-- start-placeholder="开始日期"-->
<!-- end-placeholder="结束日期"-->
<!-- ></el-date-picker>-->
<!-- </el-form-item>-->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:pointRouter:add']"
>新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:pointRouter:edit']"
>修改
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:pointRouter:remove']"
>删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['system:pointRouter:export']"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="pointRouterList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="提示路由ID" align="center" prop="pointRouterId" v-if="columns[0].visible"/>
<el-table-column label="功能模块" align="center" prop="moduleCode" v-if="columns[1].visible">
<template slot-scope="scope">
<dict-tag :options="dict.type.module_code" :value="scope.row.moduleCode"/>
</template>
</el-table-column>
<el-table-column label="提示类型" align="center" prop="pointType" v-if="columns[2].visible">
<template slot-scope="scope">
<dict-tag :options="dict.type.point_type" :value="scope.row.pointType"/>
</template>
</el-table-column>
<el-table-column label="路由地址" align="center" prop="routerAddress" v-if="columns[3].visible"/>
<el-table-column label="路由地址详情" align="center" prop="routerAddressDetail" v-if="columns[4].visible"/>
<el-table-column label="跳转标识" align="center" prop="routerFlag" v-if="columns[5].visible">
<template slot-scope="scope">
<dict-tag :options="dict.type.router_flag" :value="scope.row.routerFlag"/>
</template>
</el-table-column>
<el-table-column label="提示信息" align="center" prop="remark" v-if="columns[6].visible"/>
<el-table-column label="创建时间" align="center" prop="createTime" width="180" v-if="columns[8].visible">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="更新时间" align="center" prop="updateTime" width="180" v-if="columns[10].visible">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:pointRouter:edit']"
>修改
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:pointRouter:remove']"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改提示路由信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="功能模块" prop="moduleCode">
<el-select v-model="form.moduleCode" placeholder="请选择功能模块">
<el-option
v-for="dict in dict.type.module_code"
:key="dict.value"
:label="dict.label"
:value="dict.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="提示类型" prop="pointType">
<el-radio-group v-model="form.pointType">
<el-radio
v-for="dict in dict.type.point_type"
:key="dict.value"
:label="dict.value"
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="路由地址" prop="routerAddress">
<el-input v-model="form.routerAddress" placeholder="请输入路由地址"/>
</el-form-item>
<el-form-item label="路由地址详情" prop="routerAddressDetail">
<el-input v-model="form.routerAddressDetail" placeholder="请输入路由地址详情"/>
</el-form-item>
<!-- <el-form-item label="跳转标识" prop="routerFlag">-->
<!-- <el-radio-group v-model="form.routerFlag">-->
<!-- <el-radio-->
<!-- v-for="dict in dict.type.router_flag"-->
<!-- :key="dict.value"-->
<!-- :label="dict.value"-->
<!-- >{{ dict.label }}-->
<!-- </el-radio>-->
<!-- </el-radio-group>-->
<!-- </el-form-item>-->
<el-form-item label="提示信息" prop="remark">
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
listPointRouter,
getPointRouter,
delPointRouter,
addPointRouter,
updatePointRouter
} from "@/api/system/common/pointRouter";
export default {
name: "PointRouter",
dicts: ['point_type', 'router_flag', 'module_code'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 提示路由信息表格数据
pointRouterList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 更新时间时间范围
daterangecreateTime: [],
// 更新时间时间范围
daterangeupdateTime: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
moduleCode: null,
pointType: null,
routerAddress: null,
routerAddressDetail: null,
routerFlag: '0',
createTime: null,
updateTime: null
},
// 表单参数
form: {},
// 表单校验
rules: {
moduleCode: [
{required: true, message: "功能模块不能为空", trigger: "change"}
],
pointType: [
{required: true, message: "提示类型不能为空", trigger: "change"}
],
routerAddress: [
{required: true, message: "路由地址不能为空", trigger: "blur"}
],
},
columns: [
{key: 0, label: `提示路由ID`, visible: false},
{key: 1, label: `功能模块`, visible: true},
{key: 2, label: `提示类型`, visible: true},
{key: 3, label: `路由地址`, visible: true},
{key: 4, label: `路由地址详情`, visible: true},
{key: 5, label: `跳转标识`, visible: true},
{key: 6, label: `提示信息`, visible: false},
{key: 7, label: `创建人`, visible: false},
{key: 8, label: `创建时间`, visible: true},
{key: 9, label: `更新人`, visible: false},
{key: 10, label: `更新时间`, visible: false},
],
};
},
created() {
console.log('url参数',this.$route.query)
this.getList();
},
methods: {
/** 查询提示路由信息列表 */
getList() {
this.loading = true;
this.queryParams.params = {};
if (null != this.daterangecreateTime && '' != this.daterangecreateTime) {
this.queryParams.params["begincreateTime"] = this.daterangecreateTime[0];
this.queryParams.params["endcreateTime"] = this.daterangecreateTime[1];
}
if (null != this.daterangeupdateTime && '' != this.daterangeupdateTime) {
this.queryParams.params["beginupdateTime"] = this.daterangeupdateTime[0];
this.queryParams.params["endupdateTime"] = this.daterangeupdateTime[1];
}
listPointRouter(this.queryParams).then(response => {
this.pointRouterList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
pointRouterId: null,
moduleCode: null,
pointType: '1',
routerAddress: null,
routerAddressDetail: null,
routerFlag: null,
remark: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.daterangecreateTime = [];
this.daterangeupdateTime = [];
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.pointRouterId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加提示路由信息";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const pointRouterId = row.pointRouterId || this.ids
getPointRouter(pointRouterId).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改提示路由信息";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.pointRouterId != null) {
updatePointRouter(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
this.form.routerFlag = '0'
addPointRouter(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const pointRouterIds = row.pointRouterId || this.ids;
this.$modal.confirm('是否确认删除提示路由信息编号为"' + pointRouterIds + '"的数据项?').then(function () {
return delPointRouter(pointRouterIds);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
this.download('system/pointRouter/export', {
...this.queryParams
}, `pointRouter_${new Date().getTime()}.xlsx`)
}
}
};
</script>