From 40860ef4a79da4d4f8ffce369011c1a2450fa3c1 Mon Sep 17 00:00:00 2001
From: surprise <15810472099@163.com>
Date: 星期三, 29 十一月 2023 16:51:26 +0800
Subject: [PATCH] 表格添加字段排序功能
---
src/views/userManage/roleManage.vue | 173 +++++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 123 insertions(+), 50 deletions(-)
diff --git a/src/views/userManage/roleManage.vue b/src/views/userManage/roleManage.vue
index a4c5585..59a1ce6 100644
--- a/src/views/userManage/roleManage.vue
+++ b/src/views/userManage/roleManage.vue
@@ -1,14 +1,19 @@
<template>
<div class="logLog_box">
- <My-bread
- :list="[
+ <My-bread :list="[
`${$t('operatManage.operatManage')}`,
`${$t('userManage.roleManage')}`,
- ]"
- ></My-bread>
+ ]"></My-bread>
<el-divider />
- <div class="inquire subpage_Div" ref="container">
- <el-form ref="ruleForm" :model="roleForm" :inline="true">
+ <div
+ class="inquire subpage_Div"
+ ref="container"
+ >
+ <el-form
+ ref="ruleForm"
+ :model="roleForm"
+ :inline="true"
+ >
<div class="flex_box">
<div style="margin-right: auto">
<el-form-item
@@ -43,14 +48,21 @@
:placeholder="$t('common.pleaseInput')"
/> -->
</el-form-item>
- <el-form-item :label="$t('userManage.RM.roleName')" prop="username">
+ <el-form-item
+ :label="$t('userManage.RM.roleName')"
+ prop="username"
+ >
<el-input
v-model="roleForm.username"
:placeholder="$t('userManage.RM.roleNameHolder')"
size="small"
style="width: 200px"
>
- <i slot="suffix" class="el-icon-search" @click="onSubmit"></i>
+ <i
+ slot="suffix"
+ class="el-icon-search"
+ @click="onSubmit"
+ ></i>
</el-input>
</el-form-item>
</div>
@@ -70,10 +82,9 @@
size="small"
@click="setInsertFormdialog"
v-if="menuStatus.insert"
- ><i class="el-icon-circle-plus-outline"></i> {{
+ ><i class="el-icon-circle-plus-outline"></i> {{
$t("userManage.RM.add")
- }}</el-button
- >
+ }}</el-button>
</el-form-item>
<el-form-item>
<el-button
@@ -81,17 +92,18 @@
size="small"
@click="handleDelete()"
v-if="menuStatus.delete"
- ><i class="el-icon-delete"></i> {{
+ ><i class="el-icon-delete"></i> {{
$t("common.delete")
- }}</el-button
- >
+ }}</el-button>
</el-form-item>
<el-form-item>
- <el-button type="info" size="small" @click="resetForm('ruleForm')"
- ><i class="el-icon-delete"></i> {{
+ <el-button
+ type="info"
+ size="small"
+ @click="resetForm('ruleForm')"
+ ><i class="el-icon-delete"></i> {{
$t("userManage.RM.reset")
- }}</el-button
- >
+ }}</el-button>
</el-form-item>
</div>
</div>
@@ -144,7 +156,10 @@
</el-form>
</div>
<div class="dividing-line"></div>
- <div class="table_box subpage_Div" :style="styleVar">
+ <div
+ class="table_box subpage_Div"
+ :style="styleVar"
+ >
<el-table
:data="tableData"
style="width: 100%"
@@ -152,29 +167,40 @@
height="calc(100% - 45px)"
@selection-change="handleSelectionChange"
>
- <el-table-column type="selection" width="55" />
+ <el-table-column
+ type="selection"
+ width="55"
+ />
<el-table-column
align="center"
type="index"
:label="$t('userManage.RM.index')"
width="70px"
/>
- <el-table-column align="center" prop="id" v-if="false" />
+ <el-table-column
+ align="center"
+ prop="id"
+ sortable
+ v-if="false"
+ />
<el-table-column
align="center"
prop="name"
:label="$t('userManage.RM.roleName')"
+ sortable
/>
<el-table-column
align="center"
prop="depName"
+ sortable
:label="$t('userManage.RM.ownedSystem')"
/>
<el-table-column
align="center"
prop="isAdmin"
+ sortable
:label="$t('userManage.RM.isAdmin')"
>
<template slot-scope="scope">
@@ -185,6 +211,7 @@
<el-table-column
align="center"
prop="descr"
+ sortable
:label="$t('userManage.RM.describe')"
/>
@@ -216,7 +243,7 @@
:label="$t('userManage.RM.remarks')"
/> -->
<el-table-column
- fixed="right"
+
:label="$t('common.operate')"
width="200"
>
@@ -226,20 +253,21 @@
@click="showDetail(scope.$index, scope.row)"
size="small"
plain
- >{{ $t("common.see") }}</el-button
- >
+ >{{ $t("common.see") }}</el-button>
<el-button
v-if="menuStatus.update"
type="warning"
@click="handleEdit(scope.$index, scope.row)"
size="small"
plain
- >{{ $t("common.update") }}</el-button
- >
+ >{{ $t("common.update") }}</el-button>
</template>
</el-table-column>
</el-table>
- <div style="margin-top: 10px" class="pagination_box">
+ <div
+ style="margin-top: 10px"
+ class="pagination_box"
+ >
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@@ -260,7 +288,10 @@
:visible.sync="InsertFormdialog"
>
<div style="height: 500px; overflow: auto">
- <el-form :model="insertform" label-position="top">
+ <el-form
+ :model="insertform"
+ label-position="top"
+ >
<el-form-item
:label="$t('userManage.RM.roleName')"
:label-width="formLabelWidth"
@@ -374,11 +405,21 @@
</el-form-item>
</el-form>
</div>
- <div slot="footer" class="dialog-footer">
- <el-button size="small" @click="insertFromClose">{{
+ <div
+ slot="footer"
+ class="dialog-footer"
+ >
+ <el-button
+ size="small"
+ @click="insertFromClose"
+ >{{
$t("common.close")
}}</el-button>
- <el-button type="primary" size="small" @click="insertFromData">{{
+ <el-button
+ type="primary"
+ size="small"
+ @click="insertFromData"
+ >{{
$t("common.confirm")
}}</el-button>
</div>
@@ -389,7 +430,10 @@
:before-close="handleCloseEdit"
>
<div style="height: 500px; overflow: auto">
- <el-form :model="updateform" label-position="top">
+ <el-form
+ :model="updateform"
+ label-position="top"
+ >
<el-form-item
:label="$t('userManage.RM.roleName')"
:label-width="formLabelWidth"
@@ -451,7 +495,10 @@
v-model="updateform.isAdmin"
label="0"
>鍚�</el-radio> -->
- <el-select style="width: 85%" v-model="updateform.isAdmin">
+ <el-select
+ style="width: 85%"
+ v-model="updateform.isAdmin"
+ >
<el-option
v-for="item in options"
:key="item.value"
@@ -482,33 +529,59 @@
</el-form-item>
</el-form>
</div>
- <div slot="footer" class="dialog-footer">
- <el-button size="small" @click="updateFromClose">{{
+ <div
+ slot="footer"
+ class="dialog-footer"
+ >
+ <el-button
+ size="small"
+ @click="updateFromClose"
+ >{{
$t("common.close")
}}</el-button>
- <el-button type="primary" size="small" @click="updateFromData">{{
+ <el-button
+ type="primary"
+ size="small"
+ @click="updateFromData"
+ >{{
$t("common.confirm")
}}</el-button>
</div>
</el-dialog>
- <div class="leftTree subpage_Div box_div" v-if="showCata">
+ <div
+ class="leftTree subpage_Div box_div"
+ v-if="showCata"
+ >
<div class="treeBox">
<role-dep-tree></role-dep-tree>
</div>
<div class="btnBox">
- <el-button type="primary" size="small" @click="selectCataName"
- >纭畾</el-button
- >
- <el-button type="info" size="small" @click="showCata = false"
- >鍙栨秷</el-button
- >
+ <el-button
+ type="primary"
+ size="small"
+ @click="selectCataName"
+ >纭畾</el-button>
+ <el-button
+ type="info"
+ size="small"
+ @click="showCata = false"
+ >鍙栨秷</el-button>
</div>
</div>
- <div class="infoBox_box" v-show="showinfoBox">
+ <div
+ class="infoBox_box"
+ v-show="showinfoBox"
+ >
<div class="infoBox box_div subpage_Div">
- <div slot="header" class="clearfix">
+ <div
+ slot="header"
+ class="clearfix"
+ >
<span>{{ $t("dataManage.styleObj.deInformation") }}</span>
- <div style="float: right; cursor: pointer" @click="closeDetial">
+ <div
+ style="float: right; cursor: pointer"
+ @click="closeDetial"
+ >
<i class="el-icon-close"></i>
</div>
</div>
@@ -808,7 +881,7 @@
this.InsertFormdialog = false;
this.insertform = {};
})
- .catch((_) => {});
+ .catch((_) => { });
},
async insertFromData() {
if (this.insertform.depValue == null) {
@@ -841,7 +914,7 @@
this.updateform = {};
this.getRoleTabelData();
})
- .catch((_) => {});
+ .catch((_) => { });
},
async updateFromData() {
if (this.updateform.depValue == null) {
@@ -948,7 +1021,7 @@
.then((_) => {
this.InsertFormdialog = false;
})
- .catch((_) => {});
+ .catch((_) => { });
},
handleCloseEdit() {
this.$confirm("鍏抽棴鍚庢棤娉曚繚瀛橈紝鏄惁鍏抽棴?")
@@ -956,7 +1029,7 @@
this.UpdateFormdialog = false;
this.getRoleTabelData();
})
- .catch((_) => {});
+ .catch((_) => { });
},
},
beforeDestroy() {
--
Gitblit v1.9.3