From 36b71142347dc524e18fa24c5ffdffff0d02287a Mon Sep 17 00:00:00 2001
From: long <515897141@qq.com>
Date: 星期二, 02 二月 2021 18:56:28 +0800
Subject: [PATCH] 优化列表、回到顶部组件、优化样式
---
src/pages/system/admin.vue | 108 ++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 80 insertions(+), 28 deletions(-)
diff --git a/src/pages/system/admin.vue b/src/pages/system/admin.vue
index 2106553..478604d 100644
--- a/src/pages/system/admin.vue
+++ b/src/pages/system/admin.vue
@@ -9,6 +9,7 @@
clearable
size="small"
style="width: 240px"
+ maxlength="50"
@keyup.enter.native="reGetList"
/>
</el-form-item>
@@ -36,8 +37,13 @@
<el-table :data="list">
<el-table-column type="index" label="搴忓彿" align="center" width="60" />
- <el-table-column label="濮撳悕" prop="name" align="center" min-width="120" />
+ <el-table-column label="鍚嶇О" prop="name" align="center" min-width="120" />
<el-table-column label="璐﹀彿" prop="account" align="center" min-width="120" />
+ <el-table-column label="璐﹀彿绫诲瀷" prop="account" align="center" min-width="120">
+ <template slot-scope="scope">
+ <span v-if="scope.row.type">{{ accountTypeOptions[scope.row.type].name }}</span>
+ </template>
+ </el-table-column>
<el-table-column label="瑙掕壊" prop="roleName" align="center" min-width="120" />
<!-- <el-table-column label="鏈�杩戠櫥褰曟椂闂�" prop="loginTime" align="center" min-width="180" /> -->
<el-table-column label="鐘舵��" align="center" min-width="100">
@@ -80,31 +86,49 @@
/>
<!-- 鏂板&缂栬緫 -->
- <el-dialog :title="adminDialogData.type=='add'?'鏂板绠＄悊鍛�':'缂栬緫绠＄悊鍛�'" width="500px" :visible.sync="isShowadminDialog" append-to-body>
+ <el-dialog v-el-drag-dialog :title="adminDialogData.type==='add'?'鏂板绠＄悊鍛�':'缂栬緫绠＄悊鍛�'" width="500px" :visible.sync="adminDialogVisible" append-to-body>
<el-form ref="adminDialog" :model="adminDialogData" label-width="80px" :rules="rules" size="small">
<el-form-item label="鍚嶇О" prop="name">
- <el-input v-model="adminDialogData.name" placeholder="璇疯緭鍏ュ悕绉�" />
+ <el-input v-model="adminDialogData.name" placeholder="璇疯緭鍏ュ悕绉�" maxlength="50" />
</el-form-item>
<el-form-item label="璐﹀彿" prop="account">
- <el-input v-model="adminDialogData.account" placeholder="璇疯緭鍏ュ笎鍙�" :disabled="adminDialogData.type!='add'" />
+ <el-input v-model="adminDialogData.account" placeholder="璇疯緭鍏ュ笎鍙�" maxlength="20" :disabled="adminDialogData.type!='add'" />
</el-form-item>
- <el-form-item label="瀵嗙爜" prop="password">
- <el-input v-model="adminDialogData.password" type="password" placeholder="璇疯緭鍏ュ瘑鐮�" />
+ <el-form-item label="瀵嗙爜" :prop="adminDialogData.type==='add'?'password':'none'">
+ <el-input v-model="adminDialogData.password" type="password" placeholder="璇疯緭鍏ュ瘑鐮�" maxlength="20" />
</el-form-item>
- <el-form-item label="纭瀵嗙爜" prop="passwordSure">
- <el-input v-model="adminDialogData.passwordSure" type="password" placeholder="璇疯緭鍏ョ‘璁ゅ瘑鐮�" />
+ <el-form-item label="纭瀵嗙爜" :prop="adminDialogData.type==='add'?'passwordSure':'none'">
+ <el-input v-model="adminDialogData.passwordSure" type="password" placeholder="璇疯緭鍏ョ‘璁ゅ瘑鐮�" maxlength="20" />
+ </el-form-item>
+ <!-- 璐﹀彿绫诲瀷 -->
+ <el-form-item label="璐﹀彿绫诲瀷" prop="accountType">
+ <el-select
+ v-model="adminDialogData.accountType"
+ clearable
+ placeholder="璐﹀彿绫诲瀷"
+ style="width: 100%"
+ >
+ <el-option v-for="item in accountTypeOptions" :key="item.id" :label="item.name" :value="item.id" />
+ </el-select>
</el-form-item>
<!-- 瑙掕壊 -->
- <!-- 閫夋嫨妗� -->
<el-form-item label="瑙掕壊" prop="sysRoleId">
<el-select
v-model="adminDialogData.sysRoleId"
clearable
placeholder="瑙掕壊"
- class="com-edit-input"
+ style="width: 100%"
>
<el-option v-for="item in roleArr" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
+ </el-form-item>
+
+ <el-form-item label="鏄惁鍚敤" prop="isUse">
+ <el-switch
+ v-model="adminDialogData.isUse"
+ :active-value="1"
+ :inactive-value="0"
+ />
</el-form-item>
</el-form>
@@ -117,7 +141,6 @@
</template>
<script>
-
export default {
name: 'Admin',
data() {
@@ -136,8 +159,13 @@
// 瑙掕壊鍒楄〃
roleArr: [],
+ // 璐﹀彿绫诲瀷
+ accountTypeOptions: [
+ { name: '鏅�氱鐞嗗憳', id: 1 },
+ { name: '瓒呯骇绠＄悊鍛�', id: 0 }
+ ],
- isShowadminDialog: false,
+ adminDialogVisible: false,
adminDialogData: {},
// 鍒嗛〉 鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌
@@ -163,6 +191,12 @@
],
sysRoleId: [
{ required: true, message: '瑙掕壊涓嶈兘涓虹┖', trigger: 'change' }
+ ],
+ accountType: [
+ { required: true, message: '璐﹀彿绫诲瀷涓嶈兘涓虹┖', trigger: 'change' }
+ ],
+ isUse: [
+ { required: true, message: '鏄惁鍚敤涓嶈兘涓虹┖', trigger: 'change' }
]
}
}
@@ -180,17 +214,23 @@
// 鑾峰彇瑙掕壊鍒楄〃
getRoleList() {
this.postFN({
- url: 'admin/roleList',
+ url: 'admin/role/list',
+ params: {
+ pageNum: 1,
+ pageSize: 9999
+ },
mockData: {
code: 100,
msg: '',
- data: [{
- id: 'xxx',
- name: '閲庨┈鍙�'
- }]
+ data: {
+ list: [{
+ id: 'xxx',
+ name: '閲庨┈鍙�'
+ }]
+ }
}
}, (inf) => {
- this.roleArr = inf || []
+ this.roleArr = inf.list || []
})
},
@@ -201,7 +241,7 @@
url: 'admin/list',
params: {
pageNum: pageNum,
- rowCount: pageSize,
+ pageSize: pageSize,
keyWord: keyWord
},
mockData: {
@@ -294,10 +334,15 @@
account: '',
password: '',
passwordSure: '',
- sysRoleId: ''
+ sysRoleId: '',
+ isUse: 1,
+ accountType: 1
}
- this.adminDialogData = adminDialogData
- this.isShowadminDialog = true
+ this.adminDialogVisible = true
+ this.$nextTick(() => {
+ this.adminDialogData = adminDialogData
+ this.$refs['adminDialog'].resetFields()
+ })
},
// 鎵撳紑缂栬緫鍒嗙被寮规
showEditAdminDialog(item) {
@@ -308,15 +353,20 @@
password: '',
passwordSure: '',
sysRoleId: item.roId,
- id: item.id
+ id: item.id,
+ isUse: item.isUse,
+ accountType: item.type
}
- this.adminDialogData = adminDialogData
- this.isShowadminDialog = true
+ this.adminDialogVisible = true
+ this.$nextTick(() => {
+ this.adminDialogData = adminDialogData
+ this.$refs['adminDialog'].resetFields()
+ })
},
// 鍏抽棴缂栬緫寮圭獥
hideAdminDialog() {
this.adminDialogData = {}
- this.isShowadminDialog = false
+ this.adminDialogVisible = false
},
// 鎻愪氦鏂板&缂栬緫
submitAdmin(type) {
@@ -326,9 +376,11 @@
var params = {
name: adminDialogData.name,
account: adminDialogData.account,
- password: adminDialogData.password,
- sysAdRoleId: adminDialogData.sysRoleId
+ sysAdRoleId: adminDialogData.sysRoleId,
+ isUse: adminDialogData.isUse,
+ type: adminDialogData.accountType
}
+ if (adminDialogData.password) params.password = adminDialogData.password
var isAdd = adminDialogData.type === 'add'
var url = isAdd ? 'admin/add' : 'admin/update'
--
Gitblit v1.8.0