表格tooltip 字段修改统一
This commit is contained in:
@@ -21,7 +21,7 @@
|
||||
</div>
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator" style="margin: 5px 0 10px 2px">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus" v-has="'sys:role:add'">新建角色</a-button>
|
||||
<a-button @click="handleAdd" type="primary" icon="plus" v-has="'sys:role:add'">添加角色</a-button>
|
||||
<a-button @click="batchDel" type="danger" icon="delete">批量删除</a-button>
|
||||
</div>
|
||||
<div style="margin-top: 15px">
|
||||
@@ -36,12 +36,18 @@
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
:expandedRowKeys="expandedRowKeys"
|
||||
@expandedRowsChange="handleExpandedRowsChange"
|
||||
@change="handleTableChange">
|
||||
<span slot="action" class="action-span-cell" slot-scope="text, record">
|
||||
<a @click="handlePerssion(record.id)">授权</a>
|
||||
<a @click="handleEdit(record)" v-has="'sys:role:edit'">编辑</a>
|
||||
<a @click="handleDelete1(record.id)" v-has="'sys:role:del'">删除</a>
|
||||
<a @click="handleDelete(record.id)" v-has="'sys:role:del'">删除</a>
|
||||
</span>
|
||||
<template slot-scope="text" slot="text">
|
||||
<j-ellipsis v-if="text" :length="20" :value="text"></j-ellipsis>
|
||||
<span v-else></span>
|
||||
</template>
|
||||
</a-table>
|
||||
</div>
|
||||
|
||||
@@ -51,10 +57,11 @@
|
||||
</template>
|
||||
<script>
|
||||
import { JeroListMixin } from "@/mixins/JeroListMixin";
|
||||
import { deleteAction, postAction, getAction } from "@/api/manage";
|
||||
import {postAction, getAction } from "@/api/manage";
|
||||
import RoleModal from "./modules/RoleModal";
|
||||
import { filterObj } from "@/utils/util";
|
||||
import UserRoleModal from "./modules/UserRoleModal";
|
||||
import JEllipsis from "@comp/jero/JEllipsis";
|
||||
import moment from "moment";
|
||||
|
||||
export default {
|
||||
@@ -63,6 +70,7 @@ export default {
|
||||
components: {
|
||||
UserRoleModal,
|
||||
RoleModal,
|
||||
JEllipsis,
|
||||
moment
|
||||
},
|
||||
data() {
|
||||
@@ -70,70 +78,30 @@ export default {
|
||||
model1: {},
|
||||
model2: {},
|
||||
currentRoleId: "",
|
||||
queryParam1: {},
|
||||
queryParam2: {},
|
||||
dataSource1: [],
|
||||
dataSource2: [],
|
||||
selectedRowKeys: [],
|
||||
ipagination1: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ["10", "20", "30"],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + "-" + range[1] + " 共" + total + "条";
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
ipagination2: {
|
||||
current: 1,
|
||||
pageSize: 10,
|
||||
pageSizeOptions: ["10", "20", "30"],
|
||||
showTotal: (total, range) => {
|
||||
return range[0] + "-" + range[1] + " 共" + total + "条";
|
||||
},
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
total: 0
|
||||
},
|
||||
isorter1: {
|
||||
column: "createTime",
|
||||
order: "desc"
|
||||
},
|
||||
isorter2: {
|
||||
column: "createTime",
|
||||
order: "desc"
|
||||
},
|
||||
filters1: {},
|
||||
filters2: {},
|
||||
loading1: false,
|
||||
loading2: false,
|
||||
selectedRowKeys1: [],
|
||||
selectedRowKeys2: [],
|
||||
selectionRows1: [],
|
||||
selectionRows2: [],
|
||||
test: {},
|
||||
rightcolval: 0,
|
||||
expandedRowKeys:[],
|
||||
columns:
|
||||
[
|
||||
{
|
||||
title: "角色编码",
|
||||
align: "center",
|
||||
dataIndex: "roleCode"
|
||||
dataIndex: "roleCode",
|
||||
scopedSlots: {customRender: 'text'}
|
||||
},
|
||||
{
|
||||
title: "角色名称",
|
||||
align: "center",
|
||||
dataIndex: "roleName"
|
||||
dataIndex: "roleName",
|
||||
scopedSlots: {customRender: 'text'}
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "createTime",
|
||||
align: "center",
|
||||
sorter: true,
|
||||
scopedSlots: {customRender: 'text'},
|
||||
customRender: (text) => {
|
||||
return moment(text).format("YYYY-MM-DD");
|
||||
return moment(text).format("YYYY-MM-DD HH:mm:ss");
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -143,37 +111,6 @@ export default {
|
||||
scopedSlots: { customRender: "action" }
|
||||
}
|
||||
],
|
||||
columns2: [{
|
||||
title: "用户账号",
|
||||
align: "center",
|
||||
dataIndex: "username",
|
||||
width: 120
|
||||
},
|
||||
{
|
||||
title: "用户名称",
|
||||
align: "center",
|
||||
width: 100,
|
||||
dataIndex: "realname"
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
align: "center",
|
||||
width: 80,
|
||||
dataIndex: "status_dictText"
|
||||
},
|
||||
|
||||
{
|
||||
title: "操作",
|
||||
dataIndex: "action",
|
||||
scopedSlots: { customRender: "action" },
|
||||
align: "center",
|
||||
width: 120
|
||||
}],
|
||||
|
||||
// 高级查询参数
|
||||
superQueryParams2: "",
|
||||
// 高级查询拼接条件
|
||||
superQueryMatchType2: "and",
|
||||
url: {
|
||||
list: "/sys/role/page",
|
||||
delete: "/sys/role/delete",
|
||||
@@ -190,157 +127,13 @@ export default {
|
||||
computed: {
|
||||
importExcelUrl: function() {
|
||||
return `${window._CONFIG["domianURL"]}/${this.url.importExcelUrl}`;
|
||||
},
|
||||
leftColMd() {
|
||||
return this.selectedRowKeys1.length === 0 ? 24 : 12;
|
||||
},
|
||||
rightColMd() {
|
||||
return this.selectedRowKeys1.length === 0 ? 0 : 12;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onSelectChange2(selectedRowKeys, selectionRows) {
|
||||
this.selectedRowKeys2 = selectedRowKeys;
|
||||
this.selectionRows2 = selectionRows;
|
||||
},
|
||||
onClearSelected2() {
|
||||
this.selectedRowKeys2 = [];
|
||||
this.selectionRows2 = [];
|
||||
},
|
||||
onClearSelected1() {
|
||||
onClearSelected() {
|
||||
this.selectedRowKeys1 = [];
|
||||
this.selectionRows1 = [];
|
||||
},
|
||||
onSelectChange1(selectedRowKeys, selectionRows) {
|
||||
this.rightcolval = 1;
|
||||
this.selectedRowKeys1 = selectedRowKeys;
|
||||
this.selectionRows1 = selectionRows;
|
||||
this.model1 = Object.assign({}, selectionRows[0]);
|
||||
console.log(this.model1);
|
||||
this.currentRoleId = selectedRowKeys[0];
|
||||
this.loadData2();
|
||||
},
|
||||
onClearSelected() {
|
||||
},
|
||||
|
||||
getQueryParams2() {
|
||||
//获取查询条件
|
||||
let sqp = {};
|
||||
if (this.superQueryParams2) {
|
||||
sqp["superQueryParams"] = encodeURI(this.superQueryParams2);
|
||||
sqp["superQueryMatchType"] = this.superQueryMatchType2;
|
||||
}
|
||||
var param = Object.assign(sqp, this.queryParam2, this.isorter2, this.filters2);
|
||||
param.field = this.getQueryField2();
|
||||
param.pageNo = this.ipagination2.current;
|
||||
param.pageSize = this.ipagination2.pageSize;
|
||||
return filterObj(param);
|
||||
},
|
||||
getQueryField2() {
|
||||
//TODO 字段权限控制
|
||||
var str = "id,";
|
||||
this.columns2.forEach(function(value) {
|
||||
str += "," + value.dataIndex;
|
||||
});
|
||||
return str;
|
||||
},
|
||||
handleEdit2: function(record) {
|
||||
this.$refs.modalForm2.title = "编辑";
|
||||
this.$refs.modalForm2.roleDisabled = true;
|
||||
this.$refs.modalForm2.edit(record);
|
||||
},
|
||||
handleAdd2: function() {
|
||||
if (this.currentRoleId == "") {
|
||||
this.$message.error("请选择一个角色!");
|
||||
} else {
|
||||
this.$refs.modalForm2.roleDisabled = true;
|
||||
this.$refs.modalForm2.selectedRole = [this.currentRoleId];
|
||||
|
||||
this.$refs.modalForm2.add();
|
||||
|
||||
this.$refs.modalForm2.title = "新增";
|
||||
}
|
||||
},
|
||||
modalFormOk2() {
|
||||
// 新增/修改 成功时,重载列表
|
||||
this.loadData2();
|
||||
},
|
||||
loadData2(arg) {
|
||||
if (!this.url.list2) {
|
||||
this.$message.error("请设置url.list2属性!");
|
||||
return;
|
||||
}
|
||||
//加载数据 若传入参数1则加载第一页的内容
|
||||
if (arg === 1) {
|
||||
this.ipagination2.current = 1;
|
||||
}
|
||||
if (this.currentRoleId === "") return;
|
||||
let params = this.getQueryParams2();//查询条件
|
||||
params.roleId = this.currentRoleId;
|
||||
this.loading2 = true;
|
||||
getAction(this.url.list2, params).then((res) => {
|
||||
if (res.success) {
|
||||
this.dataSource2 = res.result.records;
|
||||
this.ipagination2.total = res.result.total;
|
||||
|
||||
}
|
||||
this.loading2 = false;
|
||||
});
|
||||
|
||||
},
|
||||
handleDelete1: function(id) {
|
||||
this.handleDelete(id);
|
||||
this.dataSource2 = [];
|
||||
this.currentRoleId = "";
|
||||
},
|
||||
handleDelete2: function(id) {
|
||||
if (!this.url.delete2) {
|
||||
this.$message.error("请设置url.delete2属性!");
|
||||
return;
|
||||
}
|
||||
var that = this;
|
||||
deleteAction(that.url.delete2, { roleId: this.currentRoleId, userId: id }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.loadData2();
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
});
|
||||
},
|
||||
batchDel2: function() {
|
||||
|
||||
if (!this.url.deleteBatch2) {
|
||||
this.$message.error("请设置url.deleteBatch2属性!");
|
||||
return;
|
||||
}
|
||||
if (this.selectedRowKeys2.length <= 0) {
|
||||
this.$message.warning("请选择一条记录!");
|
||||
return;
|
||||
} else {
|
||||
var ids = "";
|
||||
for (var a = 0; a < this.selectedRowKeys2.length; a++) {
|
||||
ids += this.selectedRowKeys2[a] + ",";
|
||||
}
|
||||
var that = this;
|
||||
console.log(this.currentDeptId);
|
||||
this.$confirm({
|
||||
title: "确认删除",
|
||||
content: "是否删除选中数据?",
|
||||
onOk: function() {
|
||||
deleteAction(that.url.deleteBatch2, { roleId: that.currentRoleId, userIds: ids }).then((res) => {
|
||||
if (res.success) {
|
||||
that.$message.success(res.message);
|
||||
that.loadData2();
|
||||
that.onClearSelected();
|
||||
} else {
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
selectOK(data) {
|
||||
let params = {};
|
||||
params.roleId = this.currentRoleId;
|
||||
@@ -381,23 +174,15 @@ export default {
|
||||
this.queryParam2 = {};
|
||||
this.loadData2(1);
|
||||
},
|
||||
handleTableChange2(pagination, filters, sorter) {
|
||||
//分页、排序、筛选变化时触发
|
||||
//TODO 筛选
|
||||
if (Object.keys(sorter).length > 0) {
|
||||
this.isorter2.column = sorter.field;
|
||||
this.isorter2.order = "ascend" == sorter.order ? "asc" : "desc";
|
||||
}
|
||||
this.ipagination2 = pagination;
|
||||
this.loadData2();
|
||||
},
|
||||
hideUserList() {
|
||||
//this.rightcolval = 0
|
||||
this.selectedRowKeys1 = [];
|
||||
},
|
||||
/*
|
||||
* 授权
|
||||
* */
|
||||
handlePerssion(roleId) {
|
||||
this.$refs.modalUserRole.show(roleId);
|
||||
}
|
||||
},
|
||||
handleExpandedRowsChange(expandedRows) {
|
||||
this.expandedRowKeys = expandedRows
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user