CN-1612 feat: 部分css重构内容: Administration下的界面、tabs和分页

This commit is contained in:
刘洪洪
2024-04-08 11:06:28 +08:00
parent 8e5a45bfcf
commit 26e3b7a4eb
20 changed files with 308 additions and 383 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div class="right-box right-box-user">
<div class="right-box__header">
<div class="header__title">{{editObject.id ? $t('config.user.editUser') : $t('config.user.createUser')}}</div>
<div class="header__title">{{ editObject.id ? $t('config.user.editUser') : $t('config.user.createUser') }}</div>
<div class="header__operation">
<span v-cancel="{object: editObject, func: esc}"><i class="cn-icon cn-icon-close"></i></span>
</div>
@@ -11,12 +11,14 @@
<el-form ref="userForm" :model="editObject" :rules="editObject.id ? rules2 : rules" label-position="top" label-width="120px">
<!--name-->
<el-form-item :label="$t('config.user.name')" prop="name">
<el-input id="account-input-name" v-model="editObject.name" :disabled="editObject.username==='admin' && editObject.id === 1"
<el-input id="account-input-name" v-model="editObject.name"
:disabled="editObject.username==='admin' && editObject.id === 1"
minlength="2" maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
</el-form-item>
<!--username-->
<el-form-item :label="$t('config.user.username')" prop="username">
<el-input id="account-input-username" v-model="editObject.username" :disabled="editObject.username==='admin' && editObject.id === 1"
<el-input id="account-input-username" v-model="editObject.username"
:disabled="editObject.username==='admin' && editObject.id === 1"
minlength="2" maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
</el-form-item>
<!--password-->
@@ -69,45 +71,28 @@
</template>
</el-select>
</el-form-item>
<!--theme-->
<!-- <el-form-item :label="$t('config.user.theme')" prop="i18n">
<el-select id="account-input-roleIds"
v-model="editObject.theme"
class="right-box__select"
clearable
collapse-tags
placeholder=" "
popper-class="right-box-select-dropdown prevent-clickoutside"
size="small">
<template v-for="theme in themeData" :key="theme.value">
<el-option :label="theme.label" :value="theme.value"></el-option>
</template>
</el-select>
</el-form-item>-->
<!--enable-->
<el-form-item :label="$t('config.user.enable')">
<el-switch
id="account-input-status"
v-model="editObject.status"
:disabled="(editObject.username === loginName) || (editObject.username === 'admin' && editObject.id === 1)"
:active-value="1"
:inactive-value="0">
id="account-input-status"
v-model="editObject.status"
:disabled="(editObject.username === loginName) || (editObject.username === 'admin' && editObject.id === 1)"
:active-value="1"
:inactive-value="0">
</el-switch>
</el-form-item>
<el-form-item v-if="editObject.id" :label="$t('config.user.createTime')">
<div class="right-box-form-content-txt">{{editObject.ctime}}</div>
<div class="right-box-form-content-txt">{{ editObject.ctime }}</div>
</el-form-item>
</el-form>
</div>
</div>
<div class="right-box__footer">
<button id="asset-edit-cancel" v-cancel="{object: editObject, func: esc}" class="footer__btn footer__btn--light">
<span>{{$t('overall.cancel')}}</span>
<span>{{ $t('overall.cancel') }}</span>
</button>
<button id="asset-edit-save" :class="{'footer__btn--disabled': blockOperation.save}" :disabled="blockOperation.save" class="footer__btn" @click="save">
<span>{{$t('overall.save')}}</span>
<span>{{ $t('overall.save') }}</span>
</button>
</div>
</div>
@@ -241,7 +226,9 @@ export default {
}
},
save () {
if (this.blockOperation.save) { return }
if (this.blockOperation.save) {
return
}
this.blockOperation.save = true
this.$refs.userForm.validate((valid) => {
@@ -250,7 +237,11 @@ export default {
axios.put(this.url, this.editObject).then(res => {
this.blockOperation.save = false
if (res.status === 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
this.$message({
duration: 2000,
type: 'success',
message: this.$t('tip.saveSuccess')
})
if (this.editObject.lang && this.editObject.id == localStorage.getItem(storageKey.userId)) {
const currentLang = localStorage.getItem(storageKey.language)
if (currentLang !== this.editObject.lang) {
@@ -271,7 +262,11 @@ export default {
axios.post(this.url, this.editObject).then(res => {
this.blockOperation.save = false
if (res.status === 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
this.$message({
duration: 2000,
type: 'success',
message: this.$t('tip.saveSuccess')
})
this.esc(true)
} else {
this.$message.error(res.data.msg || res.data.message)