added ESlint 语法检测
This commit is contained in:
何秀钢
+169
-168
@@ -3,61 +3,61 @@
|
||||
<div class="search-term">
|
||||
<el-form :inline="true" :model="searchInfo" class="demo-form-inline">
|
||||
<el-form-item label="路径">
|
||||
<el-input placeholder="路径" v-model="searchInfo.path"></el-input>
|
||||
<el-input v-model="searchInfo.path" placeholder="路径" />
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input placeholder="描述" v-model="searchInfo.description"></el-input>
|
||||
<el-input v-model="searchInfo.description" placeholder="描述" />
|
||||
</el-form-item>
|
||||
<el-form-item label="api组">
|
||||
<el-input placeholder="api组" v-model="searchInfo.apiGroup"></el-input>
|
||||
<el-input v-model="searchInfo.apiGroup" placeholder="api组" />
|
||||
</el-form-item>
|
||||
<el-form-item label="请求">
|
||||
<el-select clearable placeholder="请选择" v-model="searchInfo.method">
|
||||
<el-select v-model="searchInfo.method" clearable placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in methodOptions"
|
||||
:key="item.value"
|
||||
:label="`${item.label}(${item.value})`"
|
||||
:value="item.value"
|
||||
v-for="item in methodOptions"
|
||||
></el-option>
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSubmit" type="primary">查询</el-button>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="openDialog('addApi')" type="primary">新增api</el-button>
|
||||
<el-button type="primary" @click="openDialog('addApi')">新增api</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-popover placement="top" v-model="deleteVisible" width="160">
|
||||
<el-popover v-model="deleteVisible" placement="top" width="160">
|
||||
<p>确定要删除吗？</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button @click="deleteVisible = false" size="mini" type="text">取消</el-button>
|
||||
<el-button @click="onDelete" size="mini" type="primary">确定</el-button>
|
||||
</div>
|
||||
<el-button icon="el-icon-delete" size="mini" slot="reference" type="danger">批量删除</el-button>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
|
||||
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
|
||||
</div>
|
||||
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger">批量删除</el-button>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table :data="tableData" @sort-change="sortChange" border stripe @selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
<el-table :data="tableData" border stripe @sort-change="sortChange" @selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column label="id" min-width="60" prop="ID" sortable="custom"></el-table-column>
|
||||
<el-table-column label="api路径" min-width="150" prop="path" sortable="custom"></el-table-column>
|
||||
<el-table-column label="api分组" min-width="150" prop="apiGroup" sortable="custom"></el-table-column>
|
||||
<el-table-column label="api简介" min-width="150" prop="description" sortable="custom"></el-table-column>
|
||||
width="55"
|
||||
/>
|
||||
<el-table-column label="id" min-width="60" prop="ID" sortable="custom" />
|
||||
<el-table-column label="api路径" min-width="150" prop="path" sortable="custom" />
|
||||
<el-table-column label="api分组" min-width="150" prop="apiGroup" sortable="custom" />
|
||||
<el-table-column label="api简介" min-width="150" prop="description" sortable="custom" />
|
||||
<el-table-column label="请求" min-width="150" prop="method" sortable="custom">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
{{scope.row.method}}
|
||||
{{ scope.row.method }}
|
||||
<el-tag
|
||||
:key="scope.row.methodFiletr"
|
||||
:type="scope.row.method|tagTypeFiletr"
|
||||
effect="dark"
|
||||
size="mini"
|
||||
>{{scope.row.method|methodFiletr}}</el-tag>
|
||||
>{{ scope.row.method|methodFiletr }}</el-tag>
|
||||
<!-- {{scope.row.method|methodFiletr}} -->
|
||||
</div>
|
||||
</template>
|
||||
@@ -65,12 +65,12 @@
|
||||
|
||||
<el-table-column fixed="right" label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="editApi(scope.row)" size="small" type="primary" icon="el-icon-edit">编辑</el-button>
|
||||
<el-button size="small" type="primary" icon="el-icon-edit" @click="editApi(scope.row)">编辑</el-button>
|
||||
<el-button
|
||||
@click="deleteApi(scope.row)"
|
||||
size="small"
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
@click="deleteApi(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -81,43 +81,42 @@
|
||||
:page-sizes="[10, 30, 50, 100]"
|
||||
:style="{float:'right',padding:'20px'}"
|
||||
:total="total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
/>
|
||||
|
||||
<el-dialog :before-close="closeDialog" :title="dialogTitle" :visible.sync="dialogFormVisible">
|
||||
<el-form :inline="true" :model="form" :rules="rules" label-width="80px" ref="apiForm">
|
||||
<el-form ref="apiForm" :inline="true" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="路径" prop="path">
|
||||
<el-input autocomplete="off" v-model="form.path"></el-input>
|
||||
<el-input v-model="form.path" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="请求" prop="method">
|
||||
<el-select placeholder="请选择" v-model="form.method">
|
||||
<el-select v-model="form.method" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in methodOptions"
|
||||
:key="item.value"
|
||||
:label="`${item.label}(${item.value})`"
|
||||
:value="item.value"
|
||||
v-for="item in methodOptions"
|
||||
></el-option>
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="api分组" prop="apiGroup">
|
||||
<el-input autocomplete="off" v-model="form.apiGroup"></el-input>
|
||||
<el-input v-model="form.apiGroup" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="api简介" prop="description">
|
||||
<el-input autocomplete="off" v-model="form.description"></el-input>
|
||||
<el-input v-model="form.description" autocomplete="off" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="warning">新增Api需要在角色管理内配置权限才可使用</div>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button @click="enterDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
// 获取列表内容封装在mixins内部 getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
|
||||
|
||||
@@ -128,219 +127,221 @@ import {
|
||||
updateApi,
|
||||
deleteApi,
|
||||
deleteApisByIds
|
||||
} from "@/api/api";
|
||||
import infoList from "@/mixins/infoList";
|
||||
import { toSQLLine } from "@/utils/stringFun";
|
||||
} from '@/api/api'
|
||||
import infoList from '@/mixins/infoList'
|
||||
import { toSQLLine } from '@/utils/stringFun'
|
||||
const methodOptions = [
|
||||
{
|
||||
value: "POST",
|
||||
label: "创建",
|
||||
type: "success"
|
||||
value: 'POST',
|
||||
label: '创建',
|
||||
type: 'success'
|
||||
},
|
||||
{
|
||||
value: "GET",
|
||||
label: "查看",
|
||||
type: ""
|
||||
value: 'GET',
|
||||
label: '查看',
|
||||
type: ''
|
||||
},
|
||||
{
|
||||
value: "PUT",
|
||||
label: "更新",
|
||||
type: "warning"
|
||||
value: 'PUT',
|
||||
label: '更新',
|
||||
type: 'warning'
|
||||
},
|
||||
{
|
||||
value: "DELETE",
|
||||
label: "删除",
|
||||
type: "danger"
|
||||
value: 'DELETE',
|
||||
label: '删除',
|
||||
type: 'danger'
|
||||
}
|
||||
];
|
||||
]
|
||||
|
||||
export default {
|
||||
name: "Api",
|
||||
name: 'Api',
|
||||
filters: {
|
||||
methodFiletr(value) {
|
||||
const target = methodOptions.filter(item => item.value === value)[0]
|
||||
// return target && `${target.label}(${target.value})`
|
||||
return target && `${target.label}`
|
||||
},
|
||||
tagTypeFiletr(value) {
|
||||
const target = methodOptions.filter(item => item.value === value)[0]
|
||||
return target && `${target.type}`
|
||||
}
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
deleteVisible:false,
|
||||
deleteVisible: false,
|
||||
listApi: getApiList,
|
||||
dialogFormVisible: false,
|
||||
dialogTitle: "新增Api",
|
||||
apis:[],
|
||||
dialogTitle: '新增Api',
|
||||
apis: [],
|
||||
form: {
|
||||
path: "",
|
||||
apiGroup: "",
|
||||
method: "",
|
||||
description: ""
|
||||
path: '',
|
||||
apiGroup: '',
|
||||
method: '',
|
||||
description: ''
|
||||
},
|
||||
methodOptions: methodOptions,
|
||||
type: "",
|
||||
type: '',
|
||||
rules: {
|
||||
path: [{ required: true, message: "请输入api路径", trigger: "blur" }],
|
||||
path: [{ required: true, message: '请输入api路径', trigger: 'blur' }],
|
||||
apiGroup: [
|
||||
{ required: true, message: "请输入组名称", trigger: "blur" }
|
||||
{ required: true, message: '请输入组名称', trigger: 'blur' }
|
||||
],
|
||||
method: [
|
||||
{ required: true, message: "请选择请求方式", trigger: "blur" }
|
||||
{ required: true, message: '请选择请求方式', trigger: 'blur' }
|
||||
],
|
||||
description: [
|
||||
{ required: true, message: "请输入api介绍", trigger: "blur" }
|
||||
{ required: true, message: '请输入api介绍', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
// 选中api
|
||||
handleSelectionChange(val) {
|
||||
this.apis = val;
|
||||
},
|
||||
async onDelete(){
|
||||
const ids = this.apis.map(item=>item.ID)
|
||||
const res = await deleteApisByIds({ids})
|
||||
if(res.code==0){
|
||||
this.$message({
|
||||
type:"success",
|
||||
message:res.msg
|
||||
})
|
||||
if (this.tableData.length == ids.length && this.page > 1) {
|
||||
this.page--;
|
||||
}
|
||||
this.deleteVisible = false
|
||||
this.getTableData()
|
||||
handleSelectionChange(val) {
|
||||
this.apis = val
|
||||
},
|
||||
async onDelete() {
|
||||
const ids = this.apis.map(item => item.ID)
|
||||
const res = await deleteApisByIds({ ids })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: res.msg
|
||||
})
|
||||
if (this.tableData.length === ids.length && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
},
|
||||
this.deleteVisible = false
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
// 排序
|
||||
sortChange({ prop, order }) {
|
||||
if (prop) {
|
||||
this.searchInfo.orderKey = toSQLLine(prop);
|
||||
this.searchInfo.desc = order == "descending";
|
||||
this.searchInfo.orderKey = toSQLLine(prop)
|
||||
this.searchInfo.desc = order === 'descending'
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
},
|
||||
//条件搜索前端看此方法
|
||||
// 条件搜索前端看此方法
|
||||
onSubmit() {
|
||||
this.page = 1;
|
||||
this.pageSize = 10;
|
||||
this.getTableData();
|
||||
this.page = 1
|
||||
this.pageSize = 10
|
||||
this.getTableData()
|
||||
},
|
||||
initForm() {
|
||||
this.$refs.apiForm.resetFields();
|
||||
this.$refs.apiForm.resetFields()
|
||||
this.form = {
|
||||
path: "",
|
||||
apiGroup: "",
|
||||
method: "",
|
||||
description: ""
|
||||
};
|
||||
path: '',
|
||||
apiGroup: '',
|
||||
method: '',
|
||||
description: ''
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.initForm();
|
||||
this.dialogFormVisible = false;
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
},
|
||||
openDialog(type) {
|
||||
switch (type) {
|
||||
case "addApi":
|
||||
this.dialogTitle = "新增Api";
|
||||
break;
|
||||
case "edit":
|
||||
this.dialogTitle = "编辑Api";
|
||||
break;
|
||||
case 'addApi':
|
||||
this.dialogTitle = '新增Api'
|
||||
break
|
||||
case 'edit':
|
||||
this.dialogTitle = '编辑Api'
|
||||
break
|
||||
default:
|
||||
break;
|
||||
break
|
||||
}
|
||||
this.type = type;
|
||||
this.dialogFormVisible = true;
|
||||
this.type = type
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
async editApi(row) {
|
||||
const res = await getApiById({ id: row.ID });
|
||||
this.form = res.data.api;
|
||||
this.openDialog("edit");
|
||||
const res = await getApiById({ id: row.ID })
|
||||
this.form = res.data.api
|
||||
this.openDialog('edit')
|
||||
},
|
||||
async deleteApi(row) {
|
||||
this.$confirm("此操作将永久删除所有角色下该api, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
this.$confirm('此操作将永久删除所有角色下该api, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
const res = await deleteApi(row);
|
||||
if (res.code == 0) {
|
||||
.then(async() => {
|
||||
const res = await deleteApi(row)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功!"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: "info",
|
||||
message: "已取消删除"
|
||||
});
|
||||
});
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
async enterDialog() {
|
||||
this.$refs.apiForm.validate(async valid => {
|
||||
if (valid) {
|
||||
switch (this.type) {
|
||||
case "addApi":
|
||||
case 'addApi':
|
||||
{
|
||||
const res = await createApi(this.form);
|
||||
if (res.code == 0) {
|
||||
const res = await createApi(this.form)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "添加成功",
|
||||
type: 'success',
|
||||
message: '添加成功',
|
||||
showClose: true
|
||||
});
|
||||
})
|
||||
}
|
||||
this.getTableData();
|
||||
this.closeDialog();
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
|
||||
break;
|
||||
case "edit":
|
||||
break
|
||||
case 'edit':
|
||||
{
|
||||
const res = await updateApi(this.form);
|
||||
if (res.code == 0) {
|
||||
const res = await updateApi(this.form)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "编辑成功",
|
||||
type: 'success',
|
||||
message: '编辑成功',
|
||||
showClose: true
|
||||
});
|
||||
})
|
||||
}
|
||||
this.getTableData();
|
||||
this.closeDialog();
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
break;
|
||||
break
|
||||
default:
|
||||
// eslint-disable-next-line no-lone-blocks
|
||||
{
|
||||
this.$message({
|
||||
type: "error",
|
||||
message: "未知操作",
|
||||
type: 'error',
|
||||
message: '未知操作',
|
||||
showClose: true
|
||||
});
|
||||
})
|
||||
}
|
||||
break;
|
||||
break
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
methodFiletr(value) {
|
||||
const target = methodOptions.filter(item => item.value === value)[0];
|
||||
// return target && `${target.label}(${target.value})`
|
||||
return target && `${target.label}`;
|
||||
},
|
||||
tagTypeFiletr(value) {
|
||||
const target = methodOptions.filter(item => item.value === value)[0];
|
||||
return target && `${target.type}`;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.button-box {
|
||||
padding: 10px 20px;
|
||||
@@ -354,4 +355,4 @@ export default {
|
||||
.warning {
|
||||
color: #dc143c;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="authority">
|
||||
<div class="button-box clearflex">
|
||||
<el-button @click="addAuthority('0')" type="primary">新增角色</el-button>
|
||||
<el-button type="primary" @click="addAuthority('0')">新增角色</el-button>
|
||||
</div>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
@@ -11,74 +11,74 @@
|
||||
stripe
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column label="角色id" min-width="180" prop="authorityId"></el-table-column>
|
||||
<el-table-column label="角色名称" min-width="180" prop="authorityName"></el-table-column>
|
||||
<el-table-column label="角色id" min-width="180" prop="authorityId" />
|
||||
<el-table-column label="角色名称" min-width="180" prop="authorityName" />
|
||||
<el-table-column fixed="right" label="操作" width="460">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="opdendrawer(scope.row)" size="small" type="primary">设置权限</el-button>
|
||||
<el-button size="small" type="primary" @click="opdendrawer(scope.row)">设置权限</el-button>
|
||||
<el-button
|
||||
@click="addAuthority(scope.row.authorityId)"
|
||||
icon="el-icon-plus"
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="addAuthority(scope.row.authorityId)"
|
||||
>新增子角色</el-button>
|
||||
<el-button
|
||||
@click="copyAuthority(scope.row)"
|
||||
icon="el-icon-copy-document"
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="copyAuthority(scope.row)"
|
||||
>拷贝</el-button>
|
||||
<el-button
|
||||
@click="editAuthority(scope.row)"
|
||||
icon="el-icon-edit"
|
||||
size="small"
|
||||
type="primary"
|
||||
@click="editAuthority(scope.row)"
|
||||
>编辑</el-button>
|
||||
<el-button
|
||||
@click="deleteAuth(scope.row)"
|
||||
icon="el-icon-delete"
|
||||
size="small"
|
||||
type="danger"
|
||||
@click="deleteAuth(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!-- 新增角色弹窗 -->
|
||||
<el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible">
|
||||
<el-form :model="form" :rules="rules" ref="authorityForm">
|
||||
<el-form ref="authorityForm" :model="form" :rules="rules">
|
||||
<el-form-item label="父级角色" prop="parentId">
|
||||
<el-cascader
|
||||
v-model="form.parentId"
|
||||
:disabled="dialogType=='add'"
|
||||
:options="AuthorityOption"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
:show-all-levels="false"
|
||||
filterable
|
||||
v-model="form.parentId"
|
||||
></el-cascader>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色ID" prop="authorityId">
|
||||
<el-input :disabled="dialogType=='edit'" autocomplete="off" v-model="form.authorityId"></el-input>
|
||||
<el-input v-model="form.authorityId" :disabled="dialogType=='edit'" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色姓名" prop="authorityName">
|
||||
<el-input autocomplete="off" v-model="form.authorityName"></el-input>
|
||||
<el-input v-model="form.authorityName" autocomplete="off" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button @click="enterDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-drawer :visible.sync="drawer" :with-header="false" size="40%" title="角色配置" v-if="drawer">
|
||||
<el-drawer v-if="drawer" :visible.sync="drawer" :with-header="false" size="40%" title="角色配置">
|
||||
<el-tabs :before-leave="autoEnter" class="role-box" type="border-card">
|
||||
<el-tab-pane label="角色菜单">
|
||||
<Menus :row="activeRow" ref="menus" />
|
||||
<Menus ref="menus" :row="activeRow" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="角色api">
|
||||
<apis :row="activeRow" ref="apis" />
|
||||
<apis ref="apis" :row="activeRow" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="资源权限">
|
||||
<Datas :authority="tableData" :row="activeRow" ref="datas" />
|
||||
<Datas ref="datas" :authority="tableData" :row="activeRow" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-drawer>
|
||||
@@ -94,266 +94,267 @@ import {
|
||||
createAuthority,
|
||||
updateAuthority,
|
||||
copyAuthority
|
||||
} from "@/api/authority";
|
||||
} from '@/api/authority'
|
||||
|
||||
import Menus from "@/view/superAdmin/authority/components/menus";
|
||||
import Apis from "@/view/superAdmin/authority/components/apis";
|
||||
import Datas from "@/view/superAdmin/authority/components/datas";
|
||||
import Menus from '@/view/superAdmin/authority/components/menus'
|
||||
import Apis from '@/view/superAdmin/authority/components/apis'
|
||||
import Datas from '@/view/superAdmin/authority/components/datas'
|
||||
|
||||
import infoList from "@/mixins/infoList";
|
||||
import infoList from '@/mixins/infoList'
|
||||
export default {
|
||||
name: "Authority",
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
var mustUint = (rule, value, callback) => {
|
||||
if (!/^[0-9]*[1-9][0-9]*$/.test(value)) {
|
||||
return callback(new Error("请输入正整数"));
|
||||
}
|
||||
return callback();
|
||||
};
|
||||
|
||||
return {
|
||||
AuthorityOption: [
|
||||
{
|
||||
authorityId: "0",
|
||||
authorityName: "根角色"
|
||||
}
|
||||
],
|
||||
listApi: getAuthorityList,
|
||||
drawer: false,
|
||||
dialogType: "add",
|
||||
activeRow: {},
|
||||
activeUserId: 0,
|
||||
dialogTitle: "新增角色",
|
||||
dialogFormVisible: false,
|
||||
apiDialogFlag: false,
|
||||
copyForm: {},
|
||||
form: {
|
||||
authorityId: "",
|
||||
authorityName: "",
|
||||
parentId: "0"
|
||||
},
|
||||
rules: {
|
||||
authorityId: [
|
||||
{ required: true, message: "请输入角色ID", trigger: "blur" },
|
||||
{ validator: mustUint, trigger: "blur" }
|
||||
],
|
||||
authorityName: [
|
||||
{ required: true, message: "请输入角色名", trigger: "blur" }
|
||||
],
|
||||
parentId: [
|
||||
{ required: true, message: "请选择请求方式", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
name: 'Authority',
|
||||
components: {
|
||||
Menus,
|
||||
Apis,
|
||||
Datas
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
var mustUint = (rule, value, callback) => {
|
||||
if (!/^[0-9]*[1-9][0-9]*$/.test(value)) {
|
||||
return callback(new Error('请输入正整数'))
|
||||
}
|
||||
return callback()
|
||||
}
|
||||
|
||||
return {
|
||||
AuthorityOption: [
|
||||
{
|
||||
authorityId: '0',
|
||||
authorityName: '根角色'
|
||||
}
|
||||
],
|
||||
listApi: getAuthorityList,
|
||||
drawer: false,
|
||||
dialogType: 'add',
|
||||
activeRow: {},
|
||||
activeUserId: 0,
|
||||
dialogTitle: '新增角色',
|
||||
dialogFormVisible: false,
|
||||
apiDialogFlag: false,
|
||||
copyForm: {},
|
||||
form: {
|
||||
authorityId: '',
|
||||
authorityName: '',
|
||||
parentId: '0'
|
||||
},
|
||||
rules: {
|
||||
authorityId: [
|
||||
{ required: true, message: '请输入角色ID', trigger: 'blur' },
|
||||
{ validator: mustUint, trigger: 'blur' }
|
||||
],
|
||||
authorityName: [
|
||||
{ required: true, message: '请输入角色名', trigger: 'blur' }
|
||||
],
|
||||
parentId: [
|
||||
{ required: true, message: '请选择请求方式', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.pageSize = 999
|
||||
await this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
autoEnter(activeName, oldActiveName) {
|
||||
const paneArr = ["menus", "apis", "datas"];
|
||||
const paneArr = ['menus', 'apis', 'datas']
|
||||
if (oldActiveName) {
|
||||
if (this.$refs[paneArr[oldActiveName]].needConfirm) {
|
||||
this.$refs[paneArr[oldActiveName]].enterAndNext();
|
||||
this.$refs[paneArr[oldActiveName]].needConfirm = false;
|
||||
this.$refs[paneArr[oldActiveName]].enterAndNext()
|
||||
this.$refs[paneArr[oldActiveName]].needConfirm = false
|
||||
}
|
||||
}
|
||||
},
|
||||
// 拷贝角色
|
||||
copyAuthority(row) {
|
||||
this.setOptions();
|
||||
this.dialogTitle = "拷贝角色";
|
||||
this.dialogType = "copy";
|
||||
for (let k in this.form) {
|
||||
this.form[k] = row[k];
|
||||
this.setOptions()
|
||||
this.dialogTitle = '拷贝角色'
|
||||
this.dialogType = 'copy'
|
||||
for (const k in this.form) {
|
||||
this.form[k] = row[k]
|
||||
}
|
||||
this.copyForm = row;
|
||||
this.dialogFormVisible = true;
|
||||
this.copyForm = row
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
opdendrawer(row) {
|
||||
this.drawer = true;
|
||||
this.activeRow = row;
|
||||
this.drawer = true
|
||||
this.activeRow = row
|
||||
},
|
||||
// 删除角色
|
||||
deleteAuth(row) {
|
||||
this.$confirm("此操作将永久删除该角色, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
this.$confirm('此操作将永久删除该角色, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
const res = await deleteAuthority({ authorityId: row.authorityId });
|
||||
if (res.code == 0) {
|
||||
.then(async() => {
|
||||
const res = await deleteAuthority({ authorityId: row.authorityId })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功!"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: "info",
|
||||
message: "已取消删除"
|
||||
});
|
||||
});
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
// 初始化表单
|
||||
initForm() {
|
||||
if (this.$refs.authorityForm) {
|
||||
this.$refs.authorityForm.resetFields();
|
||||
this.$refs.authorityForm.resetFields()
|
||||
}
|
||||
this.form = {
|
||||
authorityId: "",
|
||||
authorityName: "",
|
||||
parentId: "0"
|
||||
};
|
||||
authorityId: '',
|
||||
authorityName: '',
|
||||
parentId: '0'
|
||||
}
|
||||
},
|
||||
// 关闭窗口
|
||||
closeDialog() {
|
||||
this.initForm();
|
||||
this.dialogFormVisible = false;
|
||||
this.apiDialogFlag = false;
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
this.apiDialogFlag = false
|
||||
},
|
||||
// 确定弹窗
|
||||
|
||||
async enterDialog() {
|
||||
if (this.form.authorityId == "0") {
|
||||
if (this.form.authorityId === '0') {
|
||||
this.$message({
|
||||
type: "error",
|
||||
message: "角色id不能为0"
|
||||
});
|
||||
return false;
|
||||
type: 'error',
|
||||
message: '角色id不能为0'
|
||||
})
|
||||
return false
|
||||
}
|
||||
this.$refs.authorityForm.validate(async valid => {
|
||||
if (valid) {
|
||||
switch (this.dialogType) {
|
||||
case "add":
|
||||
case 'add':
|
||||
{
|
||||
const res = await createAuthority(this.form);
|
||||
if (res.code == 0) {
|
||||
const res = await createAuthority(this.form)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "添加成功!"
|
||||
});
|
||||
this.getTableData();
|
||||
this.closeDialog();
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "edit":
|
||||
break
|
||||
case 'edit':
|
||||
{
|
||||
const res = await updateAuthority(this.form);
|
||||
if (res.code == 0) {
|
||||
const res = await updateAuthority(this.form)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "添加成功!"
|
||||
});
|
||||
this.getTableData();
|
||||
this.closeDialog();
|
||||
type: 'success',
|
||||
message: '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
this.closeDialog()
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "copy": {
|
||||
break
|
||||
case 'copy': {
|
||||
const data = {
|
||||
authority: {
|
||||
authorityId: "string",
|
||||
authorityName: "string",
|
||||
authorityId: 'string',
|
||||
authorityName: 'string',
|
||||
datauthorityId: [],
|
||||
parentId: "string"
|
||||
parentId: 'string'
|
||||
},
|
||||
oldAuthorityId: 0
|
||||
};
|
||||
data.authority.authorityId = this.form.authorityId;
|
||||
data.authority.authorityName = this.form.authorityName;
|
||||
data.authority.parentId = this.form.parentId;
|
||||
data.authority.dataAuthorityId = this.copyForm.dataAuthorityId;
|
||||
data.oldAuthorityId = this.copyForm.authorityId;
|
||||
const res = await copyAuthority(data);
|
||||
if (res.code == 0) {
|
||||
}
|
||||
data.authority.authorityId = this.form.authorityId
|
||||
data.authority.authorityName = this.form.authorityName
|
||||
data.authority.parentId = this.form.parentId
|
||||
data.authority.dataAuthorityId = this.copyForm.dataAuthorityId
|
||||
data.oldAuthorityId = this.copyForm.authorityId
|
||||
const res = await copyAuthority(data)
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "复制成功！"
|
||||
});
|
||||
this.getTableData();
|
||||
type: 'success',
|
||||
message: '复制成功！'
|
||||
})
|
||||
this.getTableData()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.initForm();
|
||||
this.dialogFormVisible = false;
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
setOptions() {
|
||||
this.AuthorityOption = [
|
||||
{
|
||||
authorityId: "0",
|
||||
authorityName: "根角色"
|
||||
authorityId: '0',
|
||||
authorityName: '根角色'
|
||||
}
|
||||
];
|
||||
this.setAuthorityOptions(this.tableData, this.AuthorityOption, false);
|
||||
]
|
||||
this.setAuthorityOptions(this.tableData, this.AuthorityOption, false)
|
||||
},
|
||||
setAuthorityOptions(AuthorityData, optionsData, disabled) {
|
||||
this.form.authorityId = String(this.form.authorityId);
|
||||
this.form.authorityId = String(this.form.authorityId)
|
||||
AuthorityData &&
|
||||
AuthorityData.map(item => {
|
||||
if (item.children && item.children.length) {
|
||||
const option = {
|
||||
authorityId: item.authorityId,
|
||||
authorityName: item.authorityName,
|
||||
disabled: disabled || item.authorityId == this.form.authorityId,
|
||||
disabled: disabled || item.authorityId === this.form.authorityId,
|
||||
children: []
|
||||
};
|
||||
}
|
||||
this.setAuthorityOptions(
|
||||
item.children,
|
||||
option.children,
|
||||
disabled || item.authorityId == this.form.authorityId
|
||||
);
|
||||
optionsData.push(option);
|
||||
disabled || item.authorityId === this.form.authorityId
|
||||
)
|
||||
optionsData.push(option)
|
||||
} else {
|
||||
const option = {
|
||||
authorityId: item.authorityId,
|
||||
authorityName: item.authorityName,
|
||||
disabled: disabled || item.authorityId == this.form.authorityId
|
||||
};
|
||||
optionsData.push(option);
|
||||
disabled: disabled || item.authorityId === this.form.authorityId
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
// 增加角色
|
||||
addAuthority(parentId) {
|
||||
this.initForm();
|
||||
this.dialogTitle = "新增角色";
|
||||
this.dialogType = "add";
|
||||
this.form.parentId = parentId;
|
||||
this.setOptions();
|
||||
this.dialogFormVisible = true;
|
||||
this.initForm()
|
||||
this.dialogTitle = '新增角色'
|
||||
this.dialogType = 'add'
|
||||
this.form.parentId = parentId
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
// 编辑角色
|
||||
editAuthority(row) {
|
||||
this.setOptions();
|
||||
this.dialogTitle = "编辑角色";
|
||||
this.dialogType = "edit";
|
||||
for (let key in this.form) {
|
||||
this.form[key] = row[key];
|
||||
this.setOptions()
|
||||
this.dialogTitle = '编辑角色'
|
||||
this.dialogType = 'edit'
|
||||
for (const key in this.form) {
|
||||
this.form[key] = row[key]
|
||||
}
|
||||
this.setOptions();
|
||||
this.dialogFormVisible = true;
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.pageSize = 999;
|
||||
await this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.authority {
|
||||
.el-input-number {
|
||||
@@ -375,4 +376,4 @@ export default {
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,21 +1,22 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="clearflex">
|
||||
<el-button @click="authApiEnter" class="fl-right" size="small" type="primary">确 定</el-button>
|
||||
<el-button class="fl-right" size="small" type="primary" @click="authApiEnter">确 定</el-button>
|
||||
</div>
|
||||
<el-tree
|
||||
ref="apiTree"
|
||||
:data="apiTreeData"
|
||||
:default-checked-keys="apiTreeIds"
|
||||
:props="apiDefaultProps"
|
||||
@check="nodeChange"
|
||||
default-expand-all
|
||||
highlight-current
|
||||
node-key="onlyId"
|
||||
ref="apiTree"
|
||||
show-checkbox
|
||||
></el-tree>
|
||||
@check="nodeChange"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAllApis } from '@/api/api'
|
||||
import { UpdateCasbin, getPolicyPathByAuthorityId } from '@/api/casbin'
|
||||
@@ -33,28 +34,43 @@ export default {
|
||||
return {
|
||||
apiTreeData: [],
|
||||
apiTreeIds: [],
|
||||
needConfirm:false,
|
||||
needConfirm: false,
|
||||
apiDefaultProps: {
|
||||
children: 'children',
|
||||
label: 'description'
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
// 获取api并整理成树结构
|
||||
const res2 = await getAllApis()
|
||||
const apis = res2.data.apis
|
||||
|
||||
this.apiTreeData = this.buildApiTree(apis)
|
||||
const res = await getPolicyPathByAuthorityId({
|
||||
authorityId: this.row.authorityId
|
||||
})
|
||||
this.activeUserId = this.row.authorityId
|
||||
this.apiTreeIds = []
|
||||
res.data.paths && res.data.paths.map(item => {
|
||||
this.apiTreeIds.push('p:' + item.path + 'm:' + item.method)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
nodeChange(){
|
||||
nodeChange() {
|
||||
this.needConfirm = true
|
||||
},
|
||||
// 暴露给外层使用的切换拦截统一方法
|
||||
enterAndNext(){
|
||||
enterAndNext() {
|
||||
this.authApiEnter()
|
||||
},
|
||||
// 创建api树方法
|
||||
buildApiTree(apis) {
|
||||
const apiObj = new Object()
|
||||
const apiObj = {}
|
||||
apis &&
|
||||
apis.map(item => {
|
||||
item.onlyId = "p:"+item.path+"m:"+item.method
|
||||
if (Object.prototype.hasOwnProperty.call(apiObj,item.apiGroup)) {
|
||||
item.onlyId = 'p:' + item.path + 'm:' + item.method
|
||||
if (Object.prototype.hasOwnProperty.call(apiObj, item.apiGroup)) {
|
||||
apiObj[item.apiGroup].push(item)
|
||||
} else {
|
||||
Object.assign(apiObj, { [item.apiGroup]: [item] })
|
||||
@@ -75,10 +91,10 @@ export default {
|
||||
async authApiEnter() {
|
||||
const checkArr = this.$refs.apiTree.getCheckedNodes(true)
|
||||
var casbinInfos = []
|
||||
checkArr&&checkArr.map(item=>{
|
||||
checkArr && checkArr.map(item => {
|
||||
var casbinInfo = {
|
||||
path:item.path,
|
||||
method:item.method
|
||||
path: item.path,
|
||||
method: item.method
|
||||
}
|
||||
casbinInfos.push(casbinInfo)
|
||||
})
|
||||
@@ -86,27 +102,10 @@ export default {
|
||||
authorityId: this.activeUserId,
|
||||
casbinInfos
|
||||
})
|
||||
if (res.code == 0) {
|
||||
this.$message({ type: 'success', message: "api设置成功" })
|
||||
if (res.code === 0) {
|
||||
this.$message({ type: 'success', message: 'api设置成功' })
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
// 获取api并整理成树结构
|
||||
const res2 = await getAllApis()
|
||||
const apis = res2.data.apis
|
||||
|
||||
this.apiTreeData = this.buildApiTree(apis)
|
||||
const res = await getPolicyPathByAuthorityId({
|
||||
authorityId: this.row.authorityId
|
||||
})
|
||||
this.activeUserId = this.row.authorityId
|
||||
this.apiTreeIds = []
|
||||
res.data.paths&&res.data.paths.map(item=>{
|
||||
this.apiTreeIds.push("p:"+item.path+"m:"+item.method)
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
</style>
|
||||
@@ -1,27 +1,21 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="clearflex" style="margin:18px">
|
||||
<el-button @click="authDataEnter" class="fl-right" size="small" type="primary">确 定</el-button>
|
||||
<el-button @click="all" class="fl-left" size="small" type="primary">全选</el-button>
|
||||
<el-button @click="self" class="fl-left" size="small" type="primary">本角色</el-button>
|
||||
<el-button @click="selfAndChildren" class="fl-left" size="small" type="primary">本角色及子角色</el-button>
|
||||
<div class="clearflex" style="margin:18px">
|
||||
<el-button class="fl-right" size="small" type="primary" @click="authDataEnter">确 定</el-button>
|
||||
<el-button class="fl-left" size="small" type="primary" @click="all">全选</el-button>
|
||||
<el-button class="fl-left" size="small" type="primary" @click="self">本角色</el-button>
|
||||
<el-button class="fl-left" size="small" type="primary" @click="selfAndChildren">本角色及子角色</el-button>
|
||||
</div>
|
||||
<el-checkbox-group v-model="dataAuthorityId" @change="selectAuthority">
|
||||
<el-checkbox v-for="(item,key) in authoritys" :label="item" :key="key">{{item.authorityName}}</el-checkbox>
|
||||
<el-checkbox-group v-model="dataAuthorityId" @change="selectAuthority">
|
||||
<el-checkbox v-for="(item,key) in authoritys" :key="key" :label="item">{{ item.authorityName }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {setDataAuthority} from '@/api/authority'
|
||||
import { setDataAuthority } from '@/api/authority'
|
||||
export default {
|
||||
name: 'Datas',
|
||||
data() {
|
||||
return {
|
||||
authoritys:[],
|
||||
dataAuthorityId:[],
|
||||
needConfirm:false
|
||||
}
|
||||
},
|
||||
props: {
|
||||
row: {
|
||||
default: function() {
|
||||
@@ -36,69 +30,74 @@ export default {
|
||||
type: Array
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
// 暴露给外层使用的切换拦截统一方法
|
||||
enterAndNext(){
|
||||
this.authDataEnter()
|
||||
},
|
||||
all(){
|
||||
this.dataAuthorityId = [...this.authoritys]
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
self(){
|
||||
this.dataAuthorityId = this.authoritys.filter(item=>item.authorityId===this.row.authorityId)
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
selfAndChildren(){
|
||||
const arrBox = []
|
||||
this.getChildrenId(this.row,arrBox)
|
||||
this.dataAuthorityId = this.authoritys.filter(item=>arrBox.indexOf(item.authorityId)>-1)
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
getChildrenId(row,arrBox){
|
||||
arrBox.push(row.authorityId)
|
||||
row.children&&row.children.map(item=>{
|
||||
this.getChildrenId(item,arrBox)
|
||||
})
|
||||
},
|
||||
// 提交
|
||||
async authDataEnter(){
|
||||
const res = await setDataAuthority(this.row)
|
||||
if(res.code == 0){
|
||||
this.$message({ type: 'success', message: "资源设置成功" })
|
||||
}
|
||||
},
|
||||
// 平铺角色
|
||||
roundAuthority(authoritys){
|
||||
authoritys&&authoritys.map(item=>{
|
||||
const obj = {}
|
||||
obj.authorityId = item.authorityId
|
||||
obj.authorityName = item.authorityName
|
||||
this.authoritys.push(obj)
|
||||
if(item.children&&item.children.length){
|
||||
this.roundAuthority(item.children)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择
|
||||
selectAuthority(){
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
}
|
||||
data() {
|
||||
return {
|
||||
authoritys: [],
|
||||
dataAuthorityId: [],
|
||||
needConfirm: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.authoritys = []
|
||||
this.dataAuthorityId = []
|
||||
this.roundAuthority(this.authority)
|
||||
this.row.dataAuthorityId&&this.row.dataAuthorityId.map(item=>{
|
||||
const obj = this.authoritys&&this.authoritys.filter(au=>au.authorityId === item.authorityId)&&this.authoritys.filter(au=>au.authorityId === item.authorityId)[0]
|
||||
this.dataAuthorityId.push(obj)
|
||||
this.authoritys = []
|
||||
this.dataAuthorityId = []
|
||||
this.roundAuthority(this.authority)
|
||||
this.row.dataAuthorityId && this.row.dataAuthorityId.map(item => {
|
||||
const obj = this.authoritys && this.authoritys.filter(au => au.authorityId === item.authorityId) && this.authoritys.filter(au => au.authorityId === item.authorityId)[0]
|
||||
this.dataAuthorityId.push(obj)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 暴露给外层使用的切换拦截统一方法
|
||||
enterAndNext() {
|
||||
this.authDataEnter()
|
||||
},
|
||||
all() {
|
||||
this.dataAuthorityId = [...this.authoritys]
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
self() {
|
||||
this.dataAuthorityId = this.authoritys.filter(item => item.authorityId === this.row.authorityId)
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
selfAndChildren() {
|
||||
const arrBox = []
|
||||
this.getChildrenId(this.row, arrBox)
|
||||
this.dataAuthorityId = this.authoritys.filter(item => arrBox.indexOf(item.authorityId) > -1)
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
},
|
||||
getChildrenId(row, arrBox) {
|
||||
arrBox.push(row.authorityId)
|
||||
row.children && row.children.map(item => {
|
||||
this.getChildrenId(item, arrBox)
|
||||
})
|
||||
},
|
||||
// 提交
|
||||
async authDataEnter() {
|
||||
const res = await setDataAuthority(this.row)
|
||||
if (res.code === 0) {
|
||||
this.$message({ type: 'success', message: '资源设置成功' })
|
||||
}
|
||||
},
|
||||
// 平铺角色
|
||||
roundAuthority(authoritys) {
|
||||
authoritys && authoritys.map(item => {
|
||||
const obj = {}
|
||||
obj.authorityId = item.authorityId
|
||||
obj.authorityName = item.authorityName
|
||||
this.authoritys.push(obj)
|
||||
if (item.children && item.children.length) {
|
||||
this.roundAuthority(item.children)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择
|
||||
selectAuthority() {
|
||||
this.row.dataAuthorityId = this.dataAuthorityId
|
||||
this.needConfirm = true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less">
|
||||
</style>
|
||||
@@ -1,40 +1,42 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="clearflex">
|
||||
<el-button @click="relation" class="fl-right" size="small" type="primary">确 定</el-button>
|
||||
<el-button class="fl-right" size="small" type="primary" @click="relation">确 定</el-button>
|
||||
</div>
|
||||
<el-tree
|
||||
ref="menuTree"
|
||||
:data="menuTreeData"
|
||||
:default-checked-keys="menuTreeIds"
|
||||
:props="menuDefaultProps"
|
||||
@check="nodeChange"
|
||||
default-expand-all
|
||||
highlight-current
|
||||
node-key="ID"
|
||||
ref="menuTree"
|
||||
show-checkbox
|
||||
@check="nodeChange"
|
||||
>
|
||||
<span class="custom-tree-node" slot-scope="{ node , data }">
|
||||
<span slot-scope="{ node , data }" class="custom-tree-node">
|
||||
<span>{{ node.label }}</span>
|
||||
<span>
|
||||
<el-button
|
||||
type="text"
|
||||
size="mini"
|
||||
:style="{color:row.defaultRouter == data.name?'#E6A23C':'#85ce61'}"
|
||||
:style="{color:row.defaultRouter === data.name?'#E6A23C':'#85ce61'}"
|
||||
:disabled="!node.checked"
|
||||
@click="() => setDefault(data)">
|
||||
{{row.defaultRouter == data.name?"首页":"设为首页"}}
|
||||
@click="() => setDefault(data)"
|
||||
>
|
||||
{{ row.defaultRouter === data.name?"首页":"设为首页" }}
|
||||
</el-button>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBaseMenuTree, getMenuAuthority, addMenuAuthority } from '@/api/menu'
|
||||
import {
|
||||
updateAuthority,
|
||||
} from "@/api/authority";
|
||||
updateAuthority
|
||||
} from '@/api/authority'
|
||||
export default {
|
||||
name: 'Menus',
|
||||
props: {
|
||||
@@ -49,45 +51,15 @@ export default {
|
||||
return {
|
||||
menuTreeData: [],
|
||||
menuTreeIds: [],
|
||||
needConfirm:false,
|
||||
needConfirm: false,
|
||||
menuDefaultProps: {
|
||||
children: 'children',
|
||||
label: function(data){
|
||||
label: function(data) {
|
||||
return data.meta.title
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async setDefault(data){
|
||||
const res = await updateAuthority({authorityId: this.row.authorityId,AuthorityName: this.row.authorityName,parentId: this.row.parentId,defaultRouter:data.name})
|
||||
if(res.code == 0){
|
||||
this.$message({type:"success",message:"设置成功"})
|
||||
this.row.defaultRouter = res.data.authority.defaultRouter
|
||||
}
|
||||
},
|
||||
nodeChange(){
|
||||
this.needConfirm = true
|
||||
},
|
||||
// 暴露给外层使用的切换拦截统一方法
|
||||
enterAndNext(){
|
||||
this.relation()
|
||||
},
|
||||
// 关联树 确认方法
|
||||
async relation() {
|
||||
const checkArr = this.$refs.menuTree.getCheckedNodes(false, true)
|
||||
const res = await addMenuAuthority({
|
||||
menus: checkArr,
|
||||
authorityId: this.row.authorityId
|
||||
})
|
||||
if (res.code == 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '菜单设置成功!'
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
// 获取所有菜单树
|
||||
const res = await getBaseMenuTree()
|
||||
@@ -103,8 +75,36 @@ export default {
|
||||
}
|
||||
})
|
||||
this.menuTreeIds = arr
|
||||
},
|
||||
methods: {
|
||||
async setDefault(data) {
|
||||
const res = await updateAuthority({ authorityId: this.row.authorityId, AuthorityName: this.row.authorityName, parentId: this.row.parentId, defaultRouter: data.name })
|
||||
if (res.code === 0) {
|
||||
this.$message({ type: 'success', message: '设置成功' })
|
||||
this.row.defaultRouter = res.data.authority.defaultRouter
|
||||
}
|
||||
},
|
||||
nodeChange() {
|
||||
this.needConfirm = true
|
||||
},
|
||||
// 暴露给外层使用的切换拦截统一方法
|
||||
enterAndNext() {
|
||||
this.relation()
|
||||
},
|
||||
// 关联树 确认方法
|
||||
async relation() {
|
||||
const checkArr = this.$refs.menuTree.getCheckedNodes(false, true)
|
||||
const res = await addMenuAuthority({
|
||||
menus: checkArr,
|
||||
authorityId: this.row.authorityId
|
||||
})
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '菜单设置成功!'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
</style>
|
||||
@@ -3,62 +3,62 @@
|
||||
<div class="search-term">
|
||||
<el-form :inline="true" :model="searchInfo" class="demo-form-inline">
|
||||
<el-form-item label="字典名（中）">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.name"></el-input>
|
||||
<el-input v-model="searchInfo.name" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="字典名（英）">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.type"></el-input>
|
||||
<el-input v-model="searchInfo.type" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="searchInfo.status" clear placeholder="请选择">
|
||||
<el-option key="true" label="是" value="true"></el-option>
|
||||
<el-option key="false" label="否" value="false"></el-option>
|
||||
<el-option key="true" label="是" value="true" />
|
||||
<el-option key="false" label="否" value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="描述">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.desc"></el-input>
|
||||
<el-input v-model="searchInfo.desc" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSubmit" type="primary">查询</el-button>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="openDialog" type="primary">新增字典</el-button>
|
||||
<el-button type="primary" @click="openDialog">新增字典</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData"
|
||||
border
|
||||
ref="multipleTable"
|
||||
stripe
|
||||
style="width: 100%"
|
||||
tooltip-effect="dark"
|
||||
>
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="日期" width="180">
|
||||
<template slot-scope="scope">{{scope.row.CreatedAt|formatDate}}</template>
|
||||
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="字典名（中）" prop="name" width="120"></el-table-column>
|
||||
<el-table-column label="字典名（中）" prop="name" width="120" />
|
||||
|
||||
<el-table-column label="字典名（英）" prop="type" width="120"></el-table-column>
|
||||
<el-table-column label="字典名（英）" prop="type" width="120" />
|
||||
|
||||
<el-table-column label="状态" prop="status" width="120">
|
||||
<template slot-scope="scope">{{scope.row.status|formatBoolean}}</template>
|
||||
<template slot-scope="scope">{{ scope.row.status|formatBoolean }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="描述" prop="desc" width="280"></el-table-column>
|
||||
<el-table-column label="描述" prop="desc" width="280" />
|
||||
|
||||
<el-table-column label="按钮组">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="toDetile(scope.row)" size="small" type="success">详情</el-button>
|
||||
<el-button @click="updateSysDictionary(scope.row)" size="small" type="primary">变更</el-button>
|
||||
<el-popover placement="top" width="160" v-model="scope.row.visible">
|
||||
<el-button size="small" type="success" @click="toDetile(scope.row)">详情</el-button>
|
||||
<el-button size="small" type="primary" @click="updateSysDictionary(scope.row)">变更</el-button>
|
||||
<el-popover v-model="scope.row.visible" placement="top" width="160">
|
||||
<p>确定要删除吗？</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="deleteSysDictionary(scope.row)">确定</el-button>
|
||||
</div>
|
||||
<el-button type="danger" icon="el-icon-delete" size="mini" slot="reference" style="margin-left:10px">删除</el-button>
|
||||
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini" style="margin-left:10px">删除</el-button>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -70,10 +70,10 @@
|
||||
:page-sizes="[10, 30, 50, 100]"
|
||||
:style="{float:'right',padding:'20px'}"
|
||||
:total="total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
/>
|
||||
|
||||
<el-dialog :before-close="closeDialog" :visible.sync="dialogFormVisible" title="弹窗操作">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
@@ -83,7 +83,7 @@
|
||||
placeholder="请输入字典名（中）"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
></el-input>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="字典名（英）" prop="type">
|
||||
<el-input
|
||||
@@ -91,19 +91,19 @@
|
||||
placeholder="请输入字典名（英）"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
></el-input>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status" required>
|
||||
<el-switch v-model="formData.status" active-text="开启" inactive-text="停用"></el-switch>
|
||||
<el-switch v-model="formData.status" active-text="开启" inactive-text="停用" />
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="desc">
|
||||
<el-input v-model="formData.desc" placeholder="请输入描述" clearable :style="{width: '100%'}"></el-input>
|
||||
<el-input v-model="formData.desc" placeholder="请输入描述" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button @click="enterDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
@@ -118,17 +118,34 @@ import {
|
||||
updateSysDictionary,
|
||||
findSysDictionary,
|
||||
getSysDictionaryList
|
||||
} from "@/api/sysDictionary"; // 此处请自行替换地址
|
||||
import { formatTimeToStr } from "@/utils/date";
|
||||
import infoList from "@/mixins/infoList";
|
||||
} from '@/api/sysDictionary' // 此处请自行替换地址
|
||||
import { formatTimeToStr } from '@/utils/date'
|
||||
import infoList from '@/mixins/infoList'
|
||||
export default {
|
||||
name: "SysDictionary",
|
||||
name: 'SysDictionary',
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time !== null && time !== '') {
|
||||
var date = new Date(time)
|
||||
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool !== null) {
|
||||
return bool ? '是' : '否'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
listApi: getSysDictionaryList,
|
||||
dialogFormVisible: false,
|
||||
type: "",
|
||||
type: '',
|
||||
formData: {
|
||||
name: null,
|
||||
type: null,
|
||||
@@ -139,124 +156,107 @@ export default {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入字典名（中）",
|
||||
trigger: "blur"
|
||||
message: '请输入字典名（中）',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入字典名（英）",
|
||||
trigger: "blur"
|
||||
message: '请输入字典名（英）',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
desc: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入描述",
|
||||
trigger: "blur"
|
||||
message: '请输入描述',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time != null && time != "") {
|
||||
var date = new Date(time);
|
||||
return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool != null) {
|
||||
return bool ? "是" : "否";
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
toDetile(row) {
|
||||
this.$router.push({
|
||||
name: "dictionaryDetail",
|
||||
name: 'dictionaryDetail',
|
||||
params: {
|
||||
id: row.ID
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
//条件搜索前端看此方法
|
||||
// 条件搜索前端看此方法
|
||||
onSubmit() {
|
||||
this.page = 1;
|
||||
this.pageSize = 10;
|
||||
if (this.searchInfo.status == "") {
|
||||
this.searchInfo.status = null;
|
||||
this.page = 1
|
||||
this.pageSize = 10
|
||||
if (this.searchInfo.status === '') {
|
||||
this.searchInfo.status = null
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
},
|
||||
async updateSysDictionary(row) {
|
||||
const res = await findSysDictionary({ ID: row.ID });
|
||||
this.type = "update";
|
||||
if (res.code == 0) {
|
||||
this.formData = res.data.resysDictionary;
|
||||
this.dialogFormVisible = true;
|
||||
const res = await findSysDictionary({ ID: row.ID })
|
||||
this.type = 'update'
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data.resysDictionary
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.dialogFormVisible = false;
|
||||
this.dialogFormVisible = false
|
||||
this.formData = {
|
||||
name: null,
|
||||
type: null,
|
||||
status: true,
|
||||
desc: null
|
||||
};
|
||||
}
|
||||
},
|
||||
async deleteSysDictionary(row) {
|
||||
row.visible = false;
|
||||
const res = await deleteSysDictionary({ ID: row.ID });
|
||||
if (res.code == 0) {
|
||||
row.visible = false
|
||||
const res = await deleteSysDictionary({ ID: row.ID })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
async enterDialog() {
|
||||
this.$refs["elForm"].validate(async valid => {
|
||||
if (!valid) return;
|
||||
let res;
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
let res
|
||||
switch (this.type) {
|
||||
case "create":
|
||||
res = await createSysDictionary(this.formData);
|
||||
break;
|
||||
case "update":
|
||||
res = await updateSysDictionary(this.formData);
|
||||
break;
|
||||
case 'create':
|
||||
res = await createSysDictionary(this.formData)
|
||||
break
|
||||
case 'update':
|
||||
res = await updateSysDictionary(this.formData)
|
||||
break
|
||||
default:
|
||||
res = await createSysDictionary(this.formData);
|
||||
break;
|
||||
res = await createSysDictionary(this.formData)
|
||||
break
|
||||
}
|
||||
if (res.code == 0) {
|
||||
this.closeDialog();
|
||||
this.getTableData();
|
||||
if (res.code === 0) {
|
||||
this.closeDialog()
|
||||
this.getTableData()
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
openDialog() {
|
||||
this.type = "create";
|
||||
this.dialogFormVisible = true;
|
||||
this.type = 'create'
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -3,58 +3,58 @@
|
||||
<div class="search-term">
|
||||
<el-form :inline="true" :model="searchInfo" class="demo-form-inline">
|
||||
<el-form-item label="展示值">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.label"></el-input>
|
||||
<el-input v-model="searchInfo.label" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="字典值">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.value"></el-input>
|
||||
<el-input v-model="searchInfo.value" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态" prop="status">
|
||||
<el-select v-model="searchInfo.status" placeholder="请选择">
|
||||
<el-option key="true" label="是" value="true"></el-option>
|
||||
<el-option key="false" label="否" value="false"></el-option>
|
||||
<el-option key="true" label="是" value="true" />
|
||||
<el-option key="false" label="否" value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSubmit" type="primary">查询</el-button>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="openDialog" type="primary">新增字典项</el-button>
|
||||
<el-button type="primary" @click="openDialog">新增字典项</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData"
|
||||
border
|
||||
ref="multipleTable"
|
||||
stripe
|
||||
style="width: 100%"
|
||||
tooltip-effect="dark"
|
||||
>
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="日期" width="180">
|
||||
<template slot-scope="scope">{{scope.row.CreatedAt|formatDate}}</template>
|
||||
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="展示值" prop="label" width="120"></el-table-column>
|
||||
<el-table-column label="展示值" prop="label" width="120" />
|
||||
|
||||
<el-table-column label="字典值" prop="value" width="120"></el-table-column>
|
||||
<el-table-column label="字典值" prop="value" width="120" />
|
||||
|
||||
<el-table-column label="启用状态" prop="status" width="120">
|
||||
<template slot-scope="scope">{{scope.row.status|formatBoolean}}</template>
|
||||
<template slot-scope="scope">{{ scope.row.status|formatBoolean }}</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="排序标记" prop="sort" width="120"></el-table-column>
|
||||
<el-table-column label="排序标记" prop="sort" width="120" />
|
||||
|
||||
<el-table-column label="按钮组">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="updateSysDictionaryDetail(scope.row)" size="small" type="primary">变更</el-button>
|
||||
<el-popover placement="top" width="160" v-model="scope.row.visible">
|
||||
<el-button size="small" type="primary" @click="updateSysDictionaryDetail(scope.row)">变更</el-button>
|
||||
<el-popover v-model="scope.row.visible" placement="top" width="160">
|
||||
<p>确定要删除吗？</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="deleteSysDictionaryDetail(scope.row)">确定</el-button>
|
||||
</div>
|
||||
<el-button type="danger" icon="el-icon-delete" size="mini" slot="reference">删除</el-button>
|
||||
<el-button slot="reference" type="danger" icon="el-icon-delete" size="mini">删除</el-button>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -66,10 +66,10 @@
|
||||
:page-sizes="[10, 30, 50, 100]"
|
||||
:style="{float:'right',padding:'20px'}"
|
||||
:total="total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
/>
|
||||
|
||||
<el-dialog :before-close="closeDialog" :visible.sync="dialogFormVisible" title="弹窗操作">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
@@ -79,7 +79,7 @@
|
||||
placeholder="请输入展示值"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
></el-input>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="字典值" prop="value">
|
||||
<el-input-number
|
||||
@@ -89,18 +89,18 @@
|
||||
placeholder="请输入字典值"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
></el-input-number>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="启用状态" prop="status" required>
|
||||
<el-switch v-model="formData.status" active-text="开启" inactive-text="停用"></el-switch>
|
||||
<el-switch v-model="formData.status" active-text="开启" inactive-text="停用" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序标记" prop="sort">
|
||||
<el-input-number v-model.number="formData.sort" placeholder="排序标记"></el-input-number>
|
||||
<el-input-number v-model.number="formData.sort" placeholder="排序标记" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button @click="enterDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@@ -113,18 +113,35 @@ import {
|
||||
updateSysDictionaryDetail,
|
||||
findSysDictionaryDetail,
|
||||
getSysDictionaryDetailList
|
||||
} from "@/api/sysDictionaryDetail"; // 此处请自行替换地址
|
||||
import { formatTimeToStr } from "@/utils/date";
|
||||
import infoList from "@/mixins/infoList";
|
||||
} from '@/api/sysDictionaryDetail' // 此处请自行替换地址
|
||||
import { formatTimeToStr } from '@/utils/date'
|
||||
import infoList from '@/mixins/infoList'
|
||||
|
||||
export default {
|
||||
name: "SysDictionaryDetail",
|
||||
name: 'SysDictionaryDetail',
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time !== null && time !== '') {
|
||||
var date = new Date(time)
|
||||
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool !== null) {
|
||||
return bool ? '是' : '否'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
listApi: getSysDictionaryDetailList,
|
||||
dialogFormVisible: false,
|
||||
type: "",
|
||||
type: '',
|
||||
formData: {
|
||||
label: null,
|
||||
value: null,
|
||||
@@ -135,123 +152,106 @@ export default {
|
||||
label: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入展示值",
|
||||
trigger: "blur"
|
||||
message: '请输入展示值',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
value: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入字典值",
|
||||
trigger: "blur"
|
||||
message: '请输入字典值',
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
sort: [
|
||||
{
|
||||
required: true,
|
||||
message: "排序标记",
|
||||
trigger: "blur"
|
||||
message: '排序标记',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time != null && time != "") {
|
||||
var date = new Date(time);
|
||||
return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool != null) {
|
||||
return bool ? "是" : "否";
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.searchInfo.sysDictionaryID = Number(this.$route.params.id)
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
//条件搜索前端看此方法
|
||||
// 条件搜索前端看此方法
|
||||
onSubmit() {
|
||||
this.page = 1;
|
||||
this.pageSize = 10;
|
||||
if (this.searchInfo.status == "") {
|
||||
this.searchInfo.status = null;
|
||||
this.page = 1
|
||||
this.pageSize = 10
|
||||
if (this.searchInfo.status === '') {
|
||||
this.searchInfo.status = null
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
},
|
||||
async updateSysDictionaryDetail(row) {
|
||||
const res = await findSysDictionaryDetail({ ID: row.ID });
|
||||
this.type = "update";
|
||||
if (res.code == 0) {
|
||||
this.formData = res.data.resysDictionaryDetail;
|
||||
this.dialogFormVisible = true;
|
||||
const res = await findSysDictionaryDetail({ ID: row.ID })
|
||||
this.type = 'update'
|
||||
if (res.code === 0) {
|
||||
this.formData = res.data.resysDictionaryDetail
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
closeDialog() {
|
||||
this.dialogFormVisible = false;
|
||||
this.dialogFormVisible = false
|
||||
this.formData = {
|
||||
label: null,
|
||||
value: null,
|
||||
status: true,
|
||||
sort: null,
|
||||
sysDictionaryID: ""
|
||||
};
|
||||
sysDictionaryID: ''
|
||||
}
|
||||
},
|
||||
async deleteSysDictionaryDetail(row) {
|
||||
row.visible = false;
|
||||
const res = await deleteSysDictionaryDetail({ ID: row.ID });
|
||||
if (res.code == 0) {
|
||||
row.visible = false
|
||||
const res = await deleteSysDictionaryDetail({ ID: row.ID })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
async enterDialog() {
|
||||
this.formData.sysDictionaryID = Number(this.$route.params.id);
|
||||
this.$refs["elForm"].validate(async valid => {
|
||||
if (!valid) return;
|
||||
let res;
|
||||
this.formData.sysDictionaryID = Number(this.$route.params.id)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
let res
|
||||
switch (this.type) {
|
||||
case "create":
|
||||
res = await createSysDictionaryDetail(this.formData);
|
||||
break;
|
||||
case "update":
|
||||
res = await updateSysDictionaryDetail(this.formData);
|
||||
break;
|
||||
case 'create':
|
||||
res = await createSysDictionaryDetail(this.formData)
|
||||
break
|
||||
case 'update':
|
||||
res = await updateSysDictionaryDetail(this.formData)
|
||||
break
|
||||
default:
|
||||
res = await createSysDictionaryDetail(this.formData);
|
||||
break;
|
||||
res = await createSysDictionaryDetail(this.formData)
|
||||
break
|
||||
}
|
||||
if (res.code == 0) {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "创建/更改成功"
|
||||
});
|
||||
this.closeDialog();
|
||||
this.getTableData();
|
||||
type: 'success',
|
||||
message: '创建/更改成功'
|
||||
})
|
||||
this.closeDialog()
|
||||
this.getTableData()
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
openDialog() {
|
||||
this.type = "create";
|
||||
this.dialogFormVisible = true;
|
||||
this.type = 'create'
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.searchInfo.sysDictionaryID = Number(this.$route.params.id);
|
||||
this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,15 +1,14 @@
|
||||
<template>
|
||||
<div>
|
||||
<keep-alive>
|
||||
<router-view v-if="$route.meta.keepAlive"></router-view>
|
||||
<router-view v-if="$route.meta.keepAlive" />
|
||||
</keep-alive>
|
||||
<router-view v-if="!$route.meta.keepAlive"></router-view>
|
||||
<router-view v-if="!$route.meta.keepAlive" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "SuperAdmin",
|
||||
};
|
||||
name: 'SuperAdmin'
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form
|
||||
ref="menuForm"
|
||||
:inline="true"
|
||||
label-width="85px"
|
||||
ref="menuForm"
|
||||
label-position="top"
|
||||
>
|
||||
<el-form-item prop="icon" style="width:100%">
|
||||
@@ -11,10 +11,10 @@
|
||||
class="icon"
|
||||
:class="'el-icon-'+ meta.icon"
|
||||
style="position: absolute; z-index: 9999; padding: 5px 10px; "
|
||||
></i>
|
||||
<el-select clearable filterable class="gva-select" v-model="meta.icon" placeholder="请选择">
|
||||
/>
|
||||
<el-select v-model="meta.icon" clearable filterable class="gva-select" placeholder="请选择">
|
||||
<el-option v-for="item in options" :key="item.key" :label="item.key" :value="item.key">
|
||||
<span class="icon" :class="item.label"></span>
|
||||
<span class="icon" :class="item.label" />
|
||||
<span style="float: left">{{ item.key }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
@@ -25,307 +25,307 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "icon",
|
||||
data() {
|
||||
return {
|
||||
input: "",
|
||||
options: [
|
||||
{ key: "platform-eleme", label: "el-icon-platform-eleme" },
|
||||
{ key: "eleme", label: "el-icon-eleme" },
|
||||
{ key: "delete-solid", label: "el-icon-delete-solid" },
|
||||
{ key: "delete", label: "el-icon-delete" },
|
||||
{ key: "s-tools", label: "el-icon-s-tools" },
|
||||
{ key: "setting", label: "el-icon-setting" },
|
||||
{ key: "user-solid", label: "el-icon-user-solid" },
|
||||
{ key: "user", label: "el-icon-user" },
|
||||
{ key: "phone", label: "el-icon-phone" },
|
||||
{ key: "phone-outline", label: "el-icon-phone-outline" },
|
||||
{ key: "more", label: "el-icon-more" },
|
||||
{ key: "more-outline", label: "el-icon-more-outline" },
|
||||
{ key: "star-on", label: "el-icon-star-on" },
|
||||
{ key: "star-off", label: "el-icon-star-off" },
|
||||
{ key: "s-goods", label: "el-icon-s-goods" },
|
||||
{ key: "goods", label: "el-icon-goods" },
|
||||
{ key: "warning", label: "el-icon-warning" },
|
||||
{ key: "warning-outline", label: "el-icon-warning-outline" },
|
||||
{ key: "question", label: "el-icon-question" },
|
||||
{ key: "info", label: "el-icon-info" },
|
||||
{ key: "remove", label: "el-icon-remove" },
|
||||
{ key: "circle-plus", label: "el-icon-circle-plus" },
|
||||
{ key: "success", label: "el-icon-success" },
|
||||
{ key: "error", label: "el-icon-error" },
|
||||
{ key: "zoom-in", label: "el-icon-zoom-in" },
|
||||
{ key: "zoom-out", label: "el-icon-zoom-out" },
|
||||
{ key: "remove-outline", label: "el-icon-remove-outline" },
|
||||
{ key: "circle-plus-outline", label: "el-icon-circle-plus-outline" },
|
||||
{ key: "circle-check", label: "el-icon-circle-check" },
|
||||
{ key: "circle-close", label: "el-icon-circle-close" },
|
||||
{ key: "s-help", label: "el-icon-s-help" },
|
||||
{ key: "help", label: "el-icon-help" },
|
||||
{ key: "minus", label: "el-icon-minus" },
|
||||
{ key: "plus", label: "el-icon-plus" },
|
||||
{ key: "check", label: "el-icon-check" },
|
||||
{ key: "close", label: "el-icon-close" },
|
||||
{ key: "picture", label: "el-icon-picture" },
|
||||
{ key: "picture-outline", label: "el-icon-picture-outline" },
|
||||
{
|
||||
key: "picture-outline-round",
|
||||
label: "el-icon-picture-outline-round"
|
||||
},
|
||||
{ key: "upload", label: "el-icon-upload" },
|
||||
{ key: "upload2", label: "el-icon-upload2" },
|
||||
{ key: "download", label: "el-icon-download" },
|
||||
{ key: "camera-solid", label: "el-icon-camera-solid" },
|
||||
{ key: "camera", label: "el-icon-camera" },
|
||||
{ key: "video-camera-solid", label: "el-icon-video-camera-solid" },
|
||||
{ key: "video-camera", label: "el-icon-video-camera" },
|
||||
{ key: "message-solid", label: "el-icon-message-solid" },
|
||||
{ key: "bell", label: "el-icon-bell" },
|
||||
{ key: "s-cooperation", label: "el-icon-s-cooperation" },
|
||||
{ key: "s-order", label: "el-icon-s-order" },
|
||||
{ key: "s-platform", label: "el-icon-s-platform" },
|
||||
{ key: "s-fold", label: "el-icon-s-fold" },
|
||||
{ key: "s-unfold", label: "el-icon-s-unfold" },
|
||||
{ key: "s-operation", label: "el-icon-s-operation" },
|
||||
{ key: "s-promotion", label: "el-icon-s-promotion" },
|
||||
{ key: "s-home", label: "el-icon-s-home" },
|
||||
{ key: "s-release", label: "el-icon-s-release" },
|
||||
{ key: "s-ticket", label: "el-icon-s-ticket" },
|
||||
{ key: "s-management", label: "el-icon-s-management" },
|
||||
{ key: "s-open", label: "el-icon-s-open" },
|
||||
{ key: "s-shop", label: "el-icon-s-shop" },
|
||||
{ key: "s-marketing", label: "el-icon-s-marketing" },
|
||||
{ key: "s-flag", label: "el-icon-s-flag" },
|
||||
{ key: "s-comment", label: "el-icon-s-comment" },
|
||||
{ key: "s-finance", label: "el-icon-s-finance" },
|
||||
{ key: "s-claim", label: "el-icon-s-claim" },
|
||||
{ key: "s-custom", label: "el-icon-s-custom" },
|
||||
{ key: "s-opportunity", label: "el-icon-s-opportunity" },
|
||||
{ key: "s-data", label: "el-icon-s-data" },
|
||||
{ key: "s-check", label: "el-icon-s-check" },
|
||||
{ key: "s-grid", label: "el-icon-s-grid" },
|
||||
{ key: "menu", label: "el-icon-menu" },
|
||||
{ key: "share", label: "el-icon-share" },
|
||||
{ key: "d-caret", label: "el-icon-d-caret" },
|
||||
{ key: "caret-left", label: "el-icon-caret-left" },
|
||||
{ key: "caret-right", label: "el-icon-caret-right" },
|
||||
{ key: "caret-bottom", label: "el-icon-caret-bottom" },
|
||||
{ key: "caret-top", label: "el-icon-caret-top" },
|
||||
{ key: "bottom-left", label: "el-icon-bottom-left" },
|
||||
{ key: "bottom-right", label: "el-icon-bottom-right" },
|
||||
{ key: "back", label: "el-icon-back" },
|
||||
{ key: "right", label: "el-icon-right" },
|
||||
{ key: "bottom", label: "el-icon-bottom" },
|
||||
{ key: "top", label: "el-icon-top" },
|
||||
{ key: "top-left", label: "el-icon-top-left" },
|
||||
{ key: "top-right", label: "el-icon-top-right" },
|
||||
{ key: "arrow-left", label: "el-icon-arrow-left" },
|
||||
{ key: "arrow-right", label: "el-icon-arrow-right" },
|
||||
{ key: "arrow-down", label: "el-icon-arrow-down" },
|
||||
{ key: "arrow-up", label: "el-icon-arrow-up" },
|
||||
{ key: "d-arrow-left", label: "el-icon-d-arrow-left" },
|
||||
{ key: "d-arrow-right", label: "el-icon-d-arrow-right" },
|
||||
{ key: "video-pause", label: "el-icon-video-pause" },
|
||||
{ key: "video-play", label: "el-icon-video-play" },
|
||||
{ key: "refresh", label: "el-icon-refresh" },
|
||||
{ key: "refresh-right", label: "el-icon-refresh-right" },
|
||||
{ key: "refresh-left", label: "el-icon-refresh-left" },
|
||||
{ key: "finished", label: "el-icon-finished" },
|
||||
{ key: "sort", label: "el-icon-sort" },
|
||||
{ key: "sort-up", label: "el-icon-sort-up" },
|
||||
{ key: "sort-down", label: "el-icon-sort-down" },
|
||||
{ key: "rank", label: "el-icon-rank" },
|
||||
{ key: "loading", label: "el-icon-loading" },
|
||||
{ key: "view", label: "el-icon-view" },
|
||||
{ key: "c-scale-to-original", label: "el-icon-c-scale-to-original" },
|
||||
{ key: "date", label: "el-icon-date" },
|
||||
{ key: "edit", label: "el-icon-edit" },
|
||||
{ key: "edit-outline", label: "el-icon-edit-outline" },
|
||||
{ key: "folder", label: "el-icon-folder" },
|
||||
{ key: "folder-opened", label: "el-icon-folder-opened" },
|
||||
{ key: "folder-add", label: "el-icon-folder-add" },
|
||||
{ key: "folder-remove", label: "el-icon-folder-remove" },
|
||||
{ key: "folder-delete", label: "el-icon-folder-delete" },
|
||||
{ key: "folder-checked", label: "el-icon-folder-checked" },
|
||||
{ key: "tickets", label: "el-icon-tickets" },
|
||||
{ key: "document-remove", label: "el-icon-document-remove" },
|
||||
{ key: "document-delete", label: "el-icon-document-delete" },
|
||||
{ key: "document-copy", label: "el-icon-document-copy" },
|
||||
{ key: "document-checked", label: "el-icon-document-checked" },
|
||||
{ key: "document", label: "el-icon-document" },
|
||||
{ key: "document-add", label: "el-icon-document-add" },
|
||||
{ key: "printer", label: "el-icon-printer" },
|
||||
{ key: "paperclip", label: "el-icon-paperclip" },
|
||||
{ key: "takeaway-box", label: "el-icon-takeaway-box" },
|
||||
{ key: "search", label: "el-icon-search" },
|
||||
{ key: "monitor", label: "el-icon-monitor" },
|
||||
{ key: "attract", label: "el-icon-attract" },
|
||||
{ key: "mobile", label: "el-icon-mobile" },
|
||||
{ key: "scissors", label: "el-icon-scissors" },
|
||||
{ key: "umbrella", label: "el-icon-umbrella" },
|
||||
{ key: "headset", label: "el-icon-headset" },
|
||||
{ key: "brush", label: "el-icon-brush" },
|
||||
{ key: "mouse", label: "el-icon-mouse" },
|
||||
{ key: "coordinate", label: "el-icon-coordinate" },
|
||||
{ key: "magic-stick", label: "el-icon-magic-stick" },
|
||||
{ key: "reading", label: "el-icon-reading" },
|
||||
{ key: "data-line", label: "el-icon-data-line" },
|
||||
{ key: "data-board", label: "el-icon-data-board" },
|
||||
{ key: "pie-chart", label: "el-icon-pie-chart" },
|
||||
{ key: "data-analysis", label: "el-icon-data-analysis" },
|
||||
{ key: "collection-tag", label: "el-icon-collection-tag" },
|
||||
{ key: "film", label: "el-icon-film" },
|
||||
{ key: "suitcase", label: "el-icon-suitcase" },
|
||||
{ key: "suitcase-1", label: "el-icon-suitcase-1" },
|
||||
{ key: "receiving", label: "el-icon-receiving" },
|
||||
{ key: "collection", label: "el-icon-collection" },
|
||||
{ key: "files", label: "el-icon-files" },
|
||||
{ key: "notebook-1", label: "el-icon-notebook-1" },
|
||||
{ key: "notebook-2", label: "el-icon-notebook-2" },
|
||||
{ key: "toilet-paper", label: "el-icon-toilet-paper" },
|
||||
{ key: "office-building", label: "el-icon-office-building" },
|
||||
{ key: "school", label: "el-icon-school" },
|
||||
{ key: "table-lamp", label: "el-icon-table-lamp" },
|
||||
{ key: "house", label: "el-icon-house" },
|
||||
{ key: "no-smoking", label: "el-icon-no-smoking" },
|
||||
{ key: "smoking", label: "el-icon-smoking" },
|
||||
{ key: "shopping-cart-full", label: "el-icon-shopping-cart-full" },
|
||||
{ key: "shopping-cart-1", label: "el-icon-shopping-cart-1" },
|
||||
{ key: "shopping-cart-2", label: "el-icon-shopping-cart-2" },
|
||||
{ key: "shopping-bag-1", label: "el-icon-shopping-bag-1" },
|
||||
{ key: "shopping-bag-2", label: "el-icon-shopping-bag-2" },
|
||||
{ key: "sold-out", label: "el-icon-sold-out" },
|
||||
{ key: "sell", label: "el-icon-sell" },
|
||||
{ key: "present", label: "el-icon-present" },
|
||||
{ key: "box", label: "el-icon-box" },
|
||||
{ key: "bank-card", label: "el-icon-bank-card" },
|
||||
{ key: "money", label: "el-icon-money" },
|
||||
{ key: "coin", label: "el-icon-coin" },
|
||||
{ key: "wallet", label: "el-icon-wallet" },
|
||||
{ key: "discount", label: "el-icon-discount" },
|
||||
{ key: "price-tag", label: "el-icon-price-tag" },
|
||||
{ key: "news", label: "el-icon-news" },
|
||||
{ key: "guide", label: "el-icon-guide" },
|
||||
{ key: "male", label: "el-icon-male" },
|
||||
{ key: "female", label: "el-icon-female" },
|
||||
{ key: "thumb", label: "el-icon-thumb" },
|
||||
{ key: "cpu", label: "el-icon-cpu" },
|
||||
{ key: "link", label: "el-icon-link" },
|
||||
{ key: "connection", label: "el-icon-connection" },
|
||||
{ key: "open", label: "el-icon-open" },
|
||||
{ key: "turn-off", label: "el-icon-turn-off" },
|
||||
{ key: "set-up", label: "el-icon-set-up" },
|
||||
{ key: "chat-round", label: "el-icon-chat-round" },
|
||||
{ key: "chat-line-round", label: "el-icon-chat-line-round" },
|
||||
{ key: "chat-square", label: "el-icon-chat-square" },
|
||||
{ key: "chat-dot-round", label: "el-icon-chat-dot-round" },
|
||||
{ key: "chat-dot-square", label: "el-icon-chat-dot-square" },
|
||||
{ key: "chat-line-square", label: "el-icon-chat-line-square" },
|
||||
{ key: "message", label: "el-icon-message" },
|
||||
{ key: "postcard", label: "el-icon-postcard" },
|
||||
{ key: "position", label: "el-icon-position" },
|
||||
{ key: "turn-off-microphone", label: "el-icon-turn-off-microphone" },
|
||||
{ key: "microphone", label: "el-icon-microphone" },
|
||||
{ key: "close-notification", label: "el-icon-close-notification" },
|
||||
{ key: "bangzhu", label: "el-icon-bangzhu" },
|
||||
{ key: "time", label: "el-icon-time" },
|
||||
{ key: "odometer", label: "el-icon-odometer" },
|
||||
{ key: "crop", label: "el-icon-crop" },
|
||||
{ key: "aim", label: "el-icon-aim" },
|
||||
{ key: "switch-button", label: "el-icon-switch-button" },
|
||||
{ key: "full-screen", label: "el-icon-full-screen" },
|
||||
{ key: "copy-document", label: "el-icon-copy-document" },
|
||||
{ key: "mic", label: "el-icon-mic" },
|
||||
{ key: "stopwatch", label: "el-icon-stopwatch" },
|
||||
{ key: "medal-1", label: "el-icon-medal-1" },
|
||||
{ key: "medal", label: "el-icon-medal" },
|
||||
{ key: "trophy", label: "el-icon-trophy" },
|
||||
{ key: "trophy-1", label: "el-icon-trophy-1" },
|
||||
{ key: "first-aid-kit", label: "el-icon-first-aid-kit" },
|
||||
{ key: "discover", label: "el-icon-discover" },
|
||||
{ key: "place", label: "el-icon-place" },
|
||||
{ key: "location", label: "el-icon-location" },
|
||||
{ key: "location-outline", label: "el-icon-location-outline" },
|
||||
{ key: "location-information", label: "el-icon-location-information" },
|
||||
{ key: "add-location", label: "el-icon-add-location" },
|
||||
{ key: "delete-location", label: "el-icon-delete-location" },
|
||||
{ key: "map-location", label: "el-icon-map-location" },
|
||||
{ key: "alarm-clock", label: "el-icon-alarm-clock" },
|
||||
{ key: "timer", label: "el-icon-timer" },
|
||||
{ key: "watch-1", label: "el-icon-watch-1" },
|
||||
{ key: "watch", label: "el-icon-watch" },
|
||||
{ key: "lock", label: "el-icon-lock" },
|
||||
{ key: "unlock", label: "el-icon-unlock" },
|
||||
{ key: "key", label: "el-icon-key" },
|
||||
{ key: "service", label: "el-icon-service" },
|
||||
{ key: "mobile-phone", label: "el-icon-mobile-phone" },
|
||||
{ key: "bicycle", label: "el-icon-bicycle" },
|
||||
{ key: "truck", label: "el-icon-truck" },
|
||||
{ key: "ship", label: "el-icon-ship" },
|
||||
{ key: "basketball", label: "el-icon-basketball" },
|
||||
{ key: "football", label: "el-icon-football" },
|
||||
{ key: "soccer", label: "el-icon-soccer" },
|
||||
{ key: "baseball", label: "el-icon-baseball" },
|
||||
{ key: "wind-power", label: "el-icon-wind-power" },
|
||||
{ key: "light-rain", label: "el-icon-light-rain" },
|
||||
{ key: "lightning", label: "el-icon-lightning" },
|
||||
{ key: "heavy-rain", label: "el-icon-heavy-rain" },
|
||||
{ key: "sunrise", label: "el-icon-sunrise" },
|
||||
{ key: "sunrise-1", label: "el-icon-sunrise-1" },
|
||||
{ key: "sunset", label: "el-icon-sunset" },
|
||||
{ key: "sunny", label: "el-icon-sunny" },
|
||||
{ key: "cloudy", label: "el-icon-cloudy" },
|
||||
{ key: "partly-cloudy", label: "el-icon-partly-cloudy" },
|
||||
{ key: "cloudy-and-sunny", label: "el-icon-cloudy-and-sunny" },
|
||||
{ key: "moon", label: "el-icon-moon" },
|
||||
{ key: "moon-night", label: "el-icon-moon-night" },
|
||||
{ key: "dish", label: "el-icon-dish" },
|
||||
{ key: "dish-1", label: "el-icon-dish-1" },
|
||||
{ key: "food", label: "el-icon-food" },
|
||||
{ key: "chicken", label: "el-icon-chicken" },
|
||||
{ key: "fork-spoon", label: "el-icon-fork-spoon" },
|
||||
{ key: "knife-fork", label: "el-icon-knife-fork" },
|
||||
{ key: "burger", label: "el-icon-burger" },
|
||||
{ key: "tableware", label: "el-icon-tableware" },
|
||||
{ key: "sugar", label: "el-icon-sugar" },
|
||||
{ key: "dessert", label: "el-icon-dessert" },
|
||||
{ key: "ice-cream", label: "el-icon-ice-cream" },
|
||||
{ key: "hot-water", label: "el-icon-hot-water" },
|
||||
{ key: "water-cup", label: "el-icon-water-cup" },
|
||||
{ key: "coffee-cup", label: "el-icon-coffee-cup" },
|
||||
{ key: "cold-drink", label: "el-icon-cold-drink" },
|
||||
{ key: "goblet", label: "el-icon-goblet" },
|
||||
{ key: "goblet-full", label: "el-icon-goblet-full" },
|
||||
{ key: "goblet-square", label: "el-icon-goblet-square" },
|
||||
{ key: "goblet-square-full", label: "el-icon-goblet-square-full" },
|
||||
{ key: "refrigerator", label: "el-icon-refrigerator" },
|
||||
{ key: "grape", label: "el-icon-grape" },
|
||||
{ key: "watermelon", label: "el-icon-watermelon" },
|
||||
{ key: "cherry", label: "el-icon-cherry" },
|
||||
{ key: "apple", label: "el-icon-apple" },
|
||||
{ key: "pear", label: "el-icon-pear" },
|
||||
{ key: "orange", label: "el-icon-orange" },
|
||||
{ key: "coffee", label: "el-icon-coffee" },
|
||||
{ key: "ice-tea", label: "el-icon-ice-tea" },
|
||||
{ key: "ice-drink", label: "el-icon-ice-drink" },
|
||||
{ key: "potato-strips", label: "el-icon-potato-strips" },
|
||||
{ key: "lollipop", label: "el-icon-lollipop" },
|
||||
{ key: "ice-cream-square", label: "el-icon-ice-cream-square" },
|
||||
{ key: "ice-cream-round", label: "el-icon-ice-cream-round" }
|
||||
],
|
||||
value: ""
|
||||
};
|
||||
},
|
||||
name: 'Icon',
|
||||
props: {
|
||||
meta: {
|
||||
default: function() {
|
||||
return {};
|
||||
return {}
|
||||
},
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
input: '',
|
||||
options: [
|
||||
{ key: 'platform-eleme', label: 'el-icon-platform-eleme' },
|
||||
{ key: 'eleme', label: 'el-icon-eleme' },
|
||||
{ key: 'delete-solid', label: 'el-icon-delete-solid' },
|
||||
{ key: 'delete', label: 'el-icon-delete' },
|
||||
{ key: 's-tools', label: 'el-icon-s-tools' },
|
||||
{ key: 'setting', label: 'el-icon-setting' },
|
||||
{ key: 'user-solid', label: 'el-icon-user-solid' },
|
||||
{ key: 'user', label: 'el-icon-user' },
|
||||
{ key: 'phone', label: 'el-icon-phone' },
|
||||
{ key: 'phone-outline', label: 'el-icon-phone-outline' },
|
||||
{ key: 'more', label: 'el-icon-more' },
|
||||
{ key: 'more-outline', label: 'el-icon-more-outline' },
|
||||
{ key: 'star-on', label: 'el-icon-star-on' },
|
||||
{ key: 'star-off', label: 'el-icon-star-off' },
|
||||
{ key: 's-goods', label: 'el-icon-s-goods' },
|
||||
{ key: 'goods', label: 'el-icon-goods' },
|
||||
{ key: 'warning', label: 'el-icon-warning' },
|
||||
{ key: 'warning-outline', label: 'el-icon-warning-outline' },
|
||||
{ key: 'question', label: 'el-icon-question' },
|
||||
{ key: 'info', label: 'el-icon-info' },
|
||||
{ key: 'remove', label: 'el-icon-remove' },
|
||||
{ key: 'circle-plus', label: 'el-icon-circle-plus' },
|
||||
{ key: 'success', label: 'el-icon-success' },
|
||||
{ key: 'error', label: 'el-icon-error' },
|
||||
{ key: 'zoom-in', label: 'el-icon-zoom-in' },
|
||||
{ key: 'zoom-out', label: 'el-icon-zoom-out' },
|
||||
{ key: 'remove-outline', label: 'el-icon-remove-outline' },
|
||||
{ key: 'circle-plus-outline', label: 'el-icon-circle-plus-outline' },
|
||||
{ key: 'circle-check', label: 'el-icon-circle-check' },
|
||||
{ key: 'circle-close', label: 'el-icon-circle-close' },
|
||||
{ key: 's-help', label: 'el-icon-s-help' },
|
||||
{ key: 'help', label: 'el-icon-help' },
|
||||
{ key: 'minus', label: 'el-icon-minus' },
|
||||
{ key: 'plus', label: 'el-icon-plus' },
|
||||
{ key: 'check', label: 'el-icon-check' },
|
||||
{ key: 'close', label: 'el-icon-close' },
|
||||
{ key: 'picture', label: 'el-icon-picture' },
|
||||
{ key: 'picture-outline', label: 'el-icon-picture-outline' },
|
||||
{
|
||||
key: 'picture-outline-round',
|
||||
label: 'el-icon-picture-outline-round'
|
||||
},
|
||||
{ key: 'upload', label: 'el-icon-upload' },
|
||||
{ key: 'upload2', label: 'el-icon-upload2' },
|
||||
{ key: 'download', label: 'el-icon-download' },
|
||||
{ key: 'camera-solid', label: 'el-icon-camera-solid' },
|
||||
{ key: 'camera', label: 'el-icon-camera' },
|
||||
{ key: 'video-camera-solid', label: 'el-icon-video-camera-solid' },
|
||||
{ key: 'video-camera', label: 'el-icon-video-camera' },
|
||||
{ key: 'message-solid', label: 'el-icon-message-solid' },
|
||||
{ key: 'bell', label: 'el-icon-bell' },
|
||||
{ key: 's-cooperation', label: 'el-icon-s-cooperation' },
|
||||
{ key: 's-order', label: 'el-icon-s-order' },
|
||||
{ key: 's-platform', label: 'el-icon-s-platform' },
|
||||
{ key: 's-fold', label: 'el-icon-s-fold' },
|
||||
{ key: 's-unfold', label: 'el-icon-s-unfold' },
|
||||
{ key: 's-operation', label: 'el-icon-s-operation' },
|
||||
{ key: 's-promotion', label: 'el-icon-s-promotion' },
|
||||
{ key: 's-home', label: 'el-icon-s-home' },
|
||||
{ key: 's-release', label: 'el-icon-s-release' },
|
||||
{ key: 's-ticket', label: 'el-icon-s-ticket' },
|
||||
{ key: 's-management', label: 'el-icon-s-management' },
|
||||
{ key: 's-open', label: 'el-icon-s-open' },
|
||||
{ key: 's-shop', label: 'el-icon-s-shop' },
|
||||
{ key: 's-marketing', label: 'el-icon-s-marketing' },
|
||||
{ key: 's-flag', label: 'el-icon-s-flag' },
|
||||
{ key: 's-comment', label: 'el-icon-s-comment' },
|
||||
{ key: 's-finance', label: 'el-icon-s-finance' },
|
||||
{ key: 's-claim', label: 'el-icon-s-claim' },
|
||||
{ key: 's-custom', label: 'el-icon-s-custom' },
|
||||
{ key: 's-opportunity', label: 'el-icon-s-opportunity' },
|
||||
{ key: 's-data', label: 'el-icon-s-data' },
|
||||
{ key: 's-check', label: 'el-icon-s-check' },
|
||||
{ key: 's-grid', label: 'el-icon-s-grid' },
|
||||
{ key: 'menu', label: 'el-icon-menu' },
|
||||
{ key: 'share', label: 'el-icon-share' },
|
||||
{ key: 'd-caret', label: 'el-icon-d-caret' },
|
||||
{ key: 'caret-left', label: 'el-icon-caret-left' },
|
||||
{ key: 'caret-right', label: 'el-icon-caret-right' },
|
||||
{ key: 'caret-bottom', label: 'el-icon-caret-bottom' },
|
||||
{ key: 'caret-top', label: 'el-icon-caret-top' },
|
||||
{ key: 'bottom-left', label: 'el-icon-bottom-left' },
|
||||
{ key: 'bottom-right', label: 'el-icon-bottom-right' },
|
||||
{ key: 'back', label: 'el-icon-back' },
|
||||
{ key: 'right', label: 'el-icon-right' },
|
||||
{ key: 'bottom', label: 'el-icon-bottom' },
|
||||
{ key: 'top', label: 'el-icon-top' },
|
||||
{ key: 'top-left', label: 'el-icon-top-left' },
|
||||
{ key: 'top-right', label: 'el-icon-top-right' },
|
||||
{ key: 'arrow-left', label: 'el-icon-arrow-left' },
|
||||
{ key: 'arrow-right', label: 'el-icon-arrow-right' },
|
||||
{ key: 'arrow-down', label: 'el-icon-arrow-down' },
|
||||
{ key: 'arrow-up', label: 'el-icon-arrow-up' },
|
||||
{ key: 'd-arrow-left', label: 'el-icon-d-arrow-left' },
|
||||
{ key: 'd-arrow-right', label: 'el-icon-d-arrow-right' },
|
||||
{ key: 'video-pause', label: 'el-icon-video-pause' },
|
||||
{ key: 'video-play', label: 'el-icon-video-play' },
|
||||
{ key: 'refresh', label: 'el-icon-refresh' },
|
||||
{ key: 'refresh-right', label: 'el-icon-refresh-right' },
|
||||
{ key: 'refresh-left', label: 'el-icon-refresh-left' },
|
||||
{ key: 'finished', label: 'el-icon-finished' },
|
||||
{ key: 'sort', label: 'el-icon-sort' },
|
||||
{ key: 'sort-up', label: 'el-icon-sort-up' },
|
||||
{ key: 'sort-down', label: 'el-icon-sort-down' },
|
||||
{ key: 'rank', label: 'el-icon-rank' },
|
||||
{ key: 'loading', label: 'el-icon-loading' },
|
||||
{ key: 'view', label: 'el-icon-view' },
|
||||
{ key: 'c-scale-to-original', label: 'el-icon-c-scale-to-original' },
|
||||
{ key: 'date', label: 'el-icon-date' },
|
||||
{ key: 'edit', label: 'el-icon-edit' },
|
||||
{ key: 'edit-outline', label: 'el-icon-edit-outline' },
|
||||
{ key: 'folder', label: 'el-icon-folder' },
|
||||
{ key: 'folder-opened', label: 'el-icon-folder-opened' },
|
||||
{ key: 'folder-add', label: 'el-icon-folder-add' },
|
||||
{ key: 'folder-remove', label: 'el-icon-folder-remove' },
|
||||
{ key: 'folder-delete', label: 'el-icon-folder-delete' },
|
||||
{ key: 'folder-checked', label: 'el-icon-folder-checked' },
|
||||
{ key: 'tickets', label: 'el-icon-tickets' },
|
||||
{ key: 'document-remove', label: 'el-icon-document-remove' },
|
||||
{ key: 'document-delete', label: 'el-icon-document-delete' },
|
||||
{ key: 'document-copy', label: 'el-icon-document-copy' },
|
||||
{ key: 'document-checked', label: 'el-icon-document-checked' },
|
||||
{ key: 'document', label: 'el-icon-document' },
|
||||
{ key: 'document-add', label: 'el-icon-document-add' },
|
||||
{ key: 'printer', label: 'el-icon-printer' },
|
||||
{ key: 'paperclip', label: 'el-icon-paperclip' },
|
||||
{ key: 'takeaway-box', label: 'el-icon-takeaway-box' },
|
||||
{ key: 'search', label: 'el-icon-search' },
|
||||
{ key: 'monitor', label: 'el-icon-monitor' },
|
||||
{ key: 'attract', label: 'el-icon-attract' },
|
||||
{ key: 'mobile', label: 'el-icon-mobile' },
|
||||
{ key: 'scissors', label: 'el-icon-scissors' },
|
||||
{ key: 'umbrella', label: 'el-icon-umbrella' },
|
||||
{ key: 'headset', label: 'el-icon-headset' },
|
||||
{ key: 'brush', label: 'el-icon-brush' },
|
||||
{ key: 'mouse', label: 'el-icon-mouse' },
|
||||
{ key: 'coordinate', label: 'el-icon-coordinate' },
|
||||
{ key: 'magic-stick', label: 'el-icon-magic-stick' },
|
||||
{ key: 'reading', label: 'el-icon-reading' },
|
||||
{ key: 'data-line', label: 'el-icon-data-line' },
|
||||
{ key: 'data-board', label: 'el-icon-data-board' },
|
||||
{ key: 'pie-chart', label: 'el-icon-pie-chart' },
|
||||
{ key: 'data-analysis', label: 'el-icon-data-analysis' },
|
||||
{ key: 'collection-tag', label: 'el-icon-collection-tag' },
|
||||
{ key: 'film', label: 'el-icon-film' },
|
||||
{ key: 'suitcase', label: 'el-icon-suitcase' },
|
||||
{ key: 'suitcase-1', label: 'el-icon-suitcase-1' },
|
||||
{ key: 'receiving', label: 'el-icon-receiving' },
|
||||
{ key: 'collection', label: 'el-icon-collection' },
|
||||
{ key: 'files', label: 'el-icon-files' },
|
||||
{ key: 'notebook-1', label: 'el-icon-notebook-1' },
|
||||
{ key: 'notebook-2', label: 'el-icon-notebook-2' },
|
||||
{ key: 'toilet-paper', label: 'el-icon-toilet-paper' },
|
||||
{ key: 'office-building', label: 'el-icon-office-building' },
|
||||
{ key: 'school', label: 'el-icon-school' },
|
||||
{ key: 'table-lamp', label: 'el-icon-table-lamp' },
|
||||
{ key: 'house', label: 'el-icon-house' },
|
||||
{ key: 'no-smoking', label: 'el-icon-no-smoking' },
|
||||
{ key: 'smoking', label: 'el-icon-smoking' },
|
||||
{ key: 'shopping-cart-full', label: 'el-icon-shopping-cart-full' },
|
||||
{ key: 'shopping-cart-1', label: 'el-icon-shopping-cart-1' },
|
||||
{ key: 'shopping-cart-2', label: 'el-icon-shopping-cart-2' },
|
||||
{ key: 'shopping-bag-1', label: 'el-icon-shopping-bag-1' },
|
||||
{ key: 'shopping-bag-2', label: 'el-icon-shopping-bag-2' },
|
||||
{ key: 'sold-out', label: 'el-icon-sold-out' },
|
||||
{ key: 'sell', label: 'el-icon-sell' },
|
||||
{ key: 'present', label: 'el-icon-present' },
|
||||
{ key: 'box', label: 'el-icon-box' },
|
||||
{ key: 'bank-card', label: 'el-icon-bank-card' },
|
||||
{ key: 'money', label: 'el-icon-money' },
|
||||
{ key: 'coin', label: 'el-icon-coin' },
|
||||
{ key: 'wallet', label: 'el-icon-wallet' },
|
||||
{ key: 'discount', label: 'el-icon-discount' },
|
||||
{ key: 'price-tag', label: 'el-icon-price-tag' },
|
||||
{ key: 'news', label: 'el-icon-news' },
|
||||
{ key: 'guide', label: 'el-icon-guide' },
|
||||
{ key: 'male', label: 'el-icon-male' },
|
||||
{ key: 'female', label: 'el-icon-female' },
|
||||
{ key: 'thumb', label: 'el-icon-thumb' },
|
||||
{ key: 'cpu', label: 'el-icon-cpu' },
|
||||
{ key: 'link', label: 'el-icon-link' },
|
||||
{ key: 'connection', label: 'el-icon-connection' },
|
||||
{ key: 'open', label: 'el-icon-open' },
|
||||
{ key: 'turn-off', label: 'el-icon-turn-off' },
|
||||
{ key: 'set-up', label: 'el-icon-set-up' },
|
||||
{ key: 'chat-round', label: 'el-icon-chat-round' },
|
||||
{ key: 'chat-line-round', label: 'el-icon-chat-line-round' },
|
||||
{ key: 'chat-square', label: 'el-icon-chat-square' },
|
||||
{ key: 'chat-dot-round', label: 'el-icon-chat-dot-round' },
|
||||
{ key: 'chat-dot-square', label: 'el-icon-chat-dot-square' },
|
||||
{ key: 'chat-line-square', label: 'el-icon-chat-line-square' },
|
||||
{ key: 'message', label: 'el-icon-message' },
|
||||
{ key: 'postcard', label: 'el-icon-postcard' },
|
||||
{ key: 'position', label: 'el-icon-position' },
|
||||
{ key: 'turn-off-microphone', label: 'el-icon-turn-off-microphone' },
|
||||
{ key: 'microphone', label: 'el-icon-microphone' },
|
||||
{ key: 'close-notification', label: 'el-icon-close-notification' },
|
||||
{ key: 'bangzhu', label: 'el-icon-bangzhu' },
|
||||
{ key: 'time', label: 'el-icon-time' },
|
||||
{ key: 'odometer', label: 'el-icon-odometer' },
|
||||
{ key: 'crop', label: 'el-icon-crop' },
|
||||
{ key: 'aim', label: 'el-icon-aim' },
|
||||
{ key: 'switch-button', label: 'el-icon-switch-button' },
|
||||
{ key: 'full-screen', label: 'el-icon-full-screen' },
|
||||
{ key: 'copy-document', label: 'el-icon-copy-document' },
|
||||
{ key: 'mic', label: 'el-icon-mic' },
|
||||
{ key: 'stopwatch', label: 'el-icon-stopwatch' },
|
||||
{ key: 'medal-1', label: 'el-icon-medal-1' },
|
||||
{ key: 'medal', label: 'el-icon-medal' },
|
||||
{ key: 'trophy', label: 'el-icon-trophy' },
|
||||
{ key: 'trophy-1', label: 'el-icon-trophy-1' },
|
||||
{ key: 'first-aid-kit', label: 'el-icon-first-aid-kit' },
|
||||
{ key: 'discover', label: 'el-icon-discover' },
|
||||
{ key: 'place', label: 'el-icon-place' },
|
||||
{ key: 'location', label: 'el-icon-location' },
|
||||
{ key: 'location-outline', label: 'el-icon-location-outline' },
|
||||
{ key: 'location-information', label: 'el-icon-location-information' },
|
||||
{ key: 'add-location', label: 'el-icon-add-location' },
|
||||
{ key: 'delete-location', label: 'el-icon-delete-location' },
|
||||
{ key: 'map-location', label: 'el-icon-map-location' },
|
||||
{ key: 'alarm-clock', label: 'el-icon-alarm-clock' },
|
||||
{ key: 'timer', label: 'el-icon-timer' },
|
||||
{ key: 'watch-1', label: 'el-icon-watch-1' },
|
||||
{ key: 'watch', label: 'el-icon-watch' },
|
||||
{ key: 'lock', label: 'el-icon-lock' },
|
||||
{ key: 'unlock', label: 'el-icon-unlock' },
|
||||
{ key: 'key', label: 'el-icon-key' },
|
||||
{ key: 'service', label: 'el-icon-service' },
|
||||
{ key: 'mobile-phone', label: 'el-icon-mobile-phone' },
|
||||
{ key: 'bicycle', label: 'el-icon-bicycle' },
|
||||
{ key: 'truck', label: 'el-icon-truck' },
|
||||
{ key: 'ship', label: 'el-icon-ship' },
|
||||
{ key: 'basketball', label: 'el-icon-basketball' },
|
||||
{ key: 'football', label: 'el-icon-football' },
|
||||
{ key: 'soccer', label: 'el-icon-soccer' },
|
||||
{ key: 'baseball', label: 'el-icon-baseball' },
|
||||
{ key: 'wind-power', label: 'el-icon-wind-power' },
|
||||
{ key: 'light-rain', label: 'el-icon-light-rain' },
|
||||
{ key: 'lightning', label: 'el-icon-lightning' },
|
||||
{ key: 'heavy-rain', label: 'el-icon-heavy-rain' },
|
||||
{ key: 'sunrise', label: 'el-icon-sunrise' },
|
||||
{ key: 'sunrise-1', label: 'el-icon-sunrise-1' },
|
||||
{ key: 'sunset', label: 'el-icon-sunset' },
|
||||
{ key: 'sunny', label: 'el-icon-sunny' },
|
||||
{ key: 'cloudy', label: 'el-icon-cloudy' },
|
||||
{ key: 'partly-cloudy', label: 'el-icon-partly-cloudy' },
|
||||
{ key: 'cloudy-and-sunny', label: 'el-icon-cloudy-and-sunny' },
|
||||
{ key: 'moon', label: 'el-icon-moon' },
|
||||
{ key: 'moon-night', label: 'el-icon-moon-night' },
|
||||
{ key: 'dish', label: 'el-icon-dish' },
|
||||
{ key: 'dish-1', label: 'el-icon-dish-1' },
|
||||
{ key: 'food', label: 'el-icon-food' },
|
||||
{ key: 'chicken', label: 'el-icon-chicken' },
|
||||
{ key: 'fork-spoon', label: 'el-icon-fork-spoon' },
|
||||
{ key: 'knife-fork', label: 'el-icon-knife-fork' },
|
||||
{ key: 'burger', label: 'el-icon-burger' },
|
||||
{ key: 'tableware', label: 'el-icon-tableware' },
|
||||
{ key: 'sugar', label: 'el-icon-sugar' },
|
||||
{ key: 'dessert', label: 'el-icon-dessert' },
|
||||
{ key: 'ice-cream', label: 'el-icon-ice-cream' },
|
||||
{ key: 'hot-water', label: 'el-icon-hot-water' },
|
||||
{ key: 'water-cup', label: 'el-icon-water-cup' },
|
||||
{ key: 'coffee-cup', label: 'el-icon-coffee-cup' },
|
||||
{ key: 'cold-drink', label: 'el-icon-cold-drink' },
|
||||
{ key: 'goblet', label: 'el-icon-goblet' },
|
||||
{ key: 'goblet-full', label: 'el-icon-goblet-full' },
|
||||
{ key: 'goblet-square', label: 'el-icon-goblet-square' },
|
||||
{ key: 'goblet-square-full', label: 'el-icon-goblet-square-full' },
|
||||
{ key: 'refrigerator', label: 'el-icon-refrigerator' },
|
||||
{ key: 'grape', label: 'el-icon-grape' },
|
||||
{ key: 'watermelon', label: 'el-icon-watermelon' },
|
||||
{ key: 'cherry', label: 'el-icon-cherry' },
|
||||
{ key: 'apple', label: 'el-icon-apple' },
|
||||
{ key: 'pear', label: 'el-icon-pear' },
|
||||
{ key: 'orange', label: 'el-icon-orange' },
|
||||
{ key: 'coffee', label: 'el-icon-coffee' },
|
||||
{ key: 'ice-tea', label: 'el-icon-ice-tea' },
|
||||
{ key: 'ice-drink', label: 'el-icon-ice-drink' },
|
||||
{ key: 'potato-strips', label: 'el-icon-potato-strips' },
|
||||
{ key: 'lollipop', label: 'el-icon-lollipop' },
|
||||
{ key: 'ice-cream-square', label: 'el-icon-ice-cream-square' },
|
||||
{ key: 'ice-cream-round', label: 'el-icon-ice-cream-round' }
|
||||
],
|
||||
value: ''
|
||||
}
|
||||
},
|
||||
methods: {}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@@ -1,52 +1,52 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="button-box clearflex">
|
||||
<el-button @click="addMenu('0')" type="primary">新增根菜单</el-button>
|
||||
<el-button type="primary" @click="addMenu('0')">新增根菜单</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 由于此处菜单跟左侧列表一一对应所以不需要分页 pageSize默认999 -->
|
||||
<el-table :data="tableData" border row-key="ID" stripe>
|
||||
<el-table-column label="ID" min-width="100" prop="ID"></el-table-column>
|
||||
<el-table-column label="路由Name" min-width="160" prop="name"></el-table-column>
|
||||
<el-table-column label="路由Path" min-width="160" prop="path"></el-table-column>
|
||||
<el-table-column label="ID" min-width="100" prop="ID" />
|
||||
<el-table-column label="路由Name" min-width="160" prop="name" />
|
||||
<el-table-column label="路由Path" min-width="160" prop="path" />
|
||||
<el-table-column label="是否隐藏" min-width="100" prop="hidden">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.hidden?"隐藏":"显示"}}</span>
|
||||
<span>{{ scope.row.hidden?"隐藏":"显示" }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="父节点" min-width="90" prop="parentId"></el-table-column>
|
||||
<el-table-column label="排序" min-width="70" prop="sort"></el-table-column>
|
||||
<el-table-column label="文件路径" min-width="360" prop="component"></el-table-column>
|
||||
<el-table-column label="父节点" min-width="90" prop="parentId" />
|
||||
<el-table-column label="排序" min-width="70" prop="sort" />
|
||||
<el-table-column label="文件路径" min-width="360" prop="component" />
|
||||
<el-table-column label="展示名称" min-width="120" prop="authorityName">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.meta.title}}</span>
|
||||
<span>{{ scope.row.meta.title }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="图标" min-width="140" prop="authorityName">
|
||||
<template slot-scope="scope">
|
||||
<i :class="`el-icon-${scope.row.meta.icon}`"></i>
|
||||
<span>{{scope.row.meta.icon}}</span>
|
||||
<i :class="`el-icon-${scope.row.meta.icon}`" />
|
||||
<span>{{ scope.row.meta.icon }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click="addMenu(scope.row.ID)"
|
||||
size="small"
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
@click="addMenu(scope.row.ID)"
|
||||
>添加子菜单</el-button>
|
||||
<el-button
|
||||
@click="editMenu(scope.row.ID)"
|
||||
size="small"
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
@click="editMenu(scope.row.ID)"
|
||||
>编辑</el-button>
|
||||
<el-button
|
||||
@click="deleteMenu(scope.row.ID)"
|
||||
size="small"
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
@click="deleteMenu(scope.row.ID)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -54,55 +54,55 @@
|
||||
|
||||
<el-dialog :before-close="handleClose" :title="dialogTitle" :visible.sync="dialogFormVisible">
|
||||
<el-form
|
||||
ref="menuForm"
|
||||
:inline="true"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
label-position="top"
|
||||
label-width="85px"
|
||||
ref="menuForm"
|
||||
>
|
||||
<el-form-item label="路由name" prop="path" style="width:30%">
|
||||
<el-input
|
||||
@change="changeName"
|
||||
v-model="form.name"
|
||||
autocomplete="off"
|
||||
placeholder="唯一英文字符串"
|
||||
v-model="form.name"
|
||||
></el-input>
|
||||
@change="changeName"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item prop="path" style="width:30%">
|
||||
<div style="display:inline-block" slot="label">
|
||||
<div slot="label" style="display:inline-block">
|
||||
路由path
|
||||
<el-checkbox style="float:right;margin-left:20px;" v-model="checkFlag">添加参数</el-checkbox>
|
||||
<el-checkbox v-model="checkFlag" style="float:right;margin-left:20px;">添加参数</el-checkbox>
|
||||
</div>
|
||||
<el-input
|
||||
v-model="form.path"
|
||||
:disabled="!checkFlag"
|
||||
autocomplete="off"
|
||||
placeholder="建议只在后方拼接参数"
|
||||
v-model="form.path"
|
||||
></el-input>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否隐藏" style="width:30%">
|
||||
<el-select placeholder="是否在列表隐藏" v-model="form.hidden">
|
||||
<el-option :value="false" label="否"></el-option>
|
||||
<el-option :value="true" label="是"></el-option>
|
||||
<el-select v-model="form.hidden" placeholder="是否在列表隐藏">
|
||||
<el-option :value="false" label="否" />
|
||||
<el-option :value="true" label="是" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="父节点Id" style="width:30%">
|
||||
<el-cascader
|
||||
:disabled="!this.isEdit"
|
||||
v-model="form.parentId"
|
||||
:disabled="!isEdit"
|
||||
:options="menuOption"
|
||||
:props="{ checkStrictly: true,label:'title',value:'ID',disabled:'disabled',emitPath:false}"
|
||||
:show-all-levels="false"
|
||||
filterable
|
||||
v-model="form.parentId"
|
||||
></el-cascader>
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="文件路径" prop="component" style="width:60%">
|
||||
<el-input autocomplete="off" v-model="form.component"></el-input>
|
||||
<el-input v-model="form.component" autocomplete="off" />
|
||||
<span style="font-size:12px;margin-right:12px;">如果菜单包含子菜单，请创建router-view二级路由页面或者</span><el-button size="mini" @click="form.component = 'view/routerHolder.vue'">点我设置</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="展示名称" prop="meta.title" style="width:30%">
|
||||
<el-input autocomplete="off" v-model="form.meta.title"></el-input>
|
||||
<el-input v-model="form.meta.title" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="图标" prop="meta.icon" style="width:30%">
|
||||
<icon :meta="form.meta">
|
||||
@@ -110,18 +110,18 @@
|
||||
</icon>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序标记" prop="sort" style="width:30%">
|
||||
<el-input autocomplete="off" v-model.number="form.sort"></el-input>
|
||||
<el-input v-model.number="form.sort" autocomplete="off" />
|
||||
</el-form-item>
|
||||
<el-form-item label="keepAlive" prop="meta.keepAlive" style="width:30%">
|
||||
<el-select placeholder="是否keepAlive缓存页面" v-model="form.meta.keepAlive">
|
||||
<el-option :value="false" label="否"></el-option>
|
||||
<el-option :value="true" label="是"></el-option>
|
||||
<el-select v-model="form.meta.keepAlive" placeholder="是否keepAlive缓存页面">
|
||||
<el-option :value="false" label="否" />
|
||||
<el-option :value="true" label="是" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="closeTab" prop="meta.closeTab" style="width:30%">
|
||||
<el-select placeholder="是否自动关闭tab" v-model="form.meta.closeTab">
|
||||
<el-option :value="false" label="否"></el-option>
|
||||
<el-option :value="true" label="是"></el-option>
|
||||
<el-select v-model="form.meta.closeTab" placeholder="是否自动关闭tab">
|
||||
<el-option :value="false" label="否" />
|
||||
<el-option :value="true" label="是" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@@ -137,22 +137,22 @@
|
||||
<el-table-column prop="type" label="参数类型" width="180">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.type" placeholder="请选择">
|
||||
<el-option key="query" value="query" label="query"></el-option>
|
||||
<el-option key="params" value="params" label="params"></el-option>
|
||||
<el-option key="query" value="query" label="query" />
|
||||
<el-option key="params" value="params" label="params" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="key" label="参数key" width="180">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-input v-model="scope.row.key"></el-input>
|
||||
<el-input v-model="scope.row.key" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="value" label="参数值">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-input v-model="scope.row.value"></el-input>
|
||||
<el-input v-model="scope.row.value" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -170,9 +170,9 @@
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button @click="enterDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@@ -187,34 +187,37 @@ import {
|
||||
addBaseMenu,
|
||||
deleteBaseMenu,
|
||||
getBaseMenuById
|
||||
} from "@/api/menu";
|
||||
import infoList from "@/mixins/infoList";
|
||||
import icon from "@/view/superAdmin/menu/icon";
|
||||
} from '@/api/menu'
|
||||
import infoList from '@/mixins/infoList'
|
||||
import icon from '@/view/superAdmin/menu/icon'
|
||||
export default {
|
||||
name: "Menus",
|
||||
name: 'Menus',
|
||||
components: {
|
||||
icon
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
checkFlag: false,
|
||||
listApi: getMenuList,
|
||||
dialogFormVisible: false,
|
||||
dialogTitle: "新增菜单",
|
||||
dialogTitle: '新增菜单',
|
||||
menuOption: [
|
||||
{
|
||||
ID: "0",
|
||||
title: "根菜单"
|
||||
ID: '0',
|
||||
title: '根菜单'
|
||||
}
|
||||
],
|
||||
form: {
|
||||
ID: 0,
|
||||
path: "",
|
||||
name: "",
|
||||
hidden: "",
|
||||
parentId: "",
|
||||
component: "",
|
||||
path: '',
|
||||
name: '',
|
||||
hidden: '',
|
||||
parentId: '',
|
||||
component: '',
|
||||
meta: {
|
||||
title: "",
|
||||
icon: "",
|
||||
title: '',
|
||||
icon: '',
|
||||
defaultMenu: false,
|
||||
closeTab: false,
|
||||
keepAlive: false
|
||||
@@ -222,46 +225,47 @@ export default {
|
||||
parameters: []
|
||||
},
|
||||
rules: {
|
||||
path: [{ required: true, message: "请输入菜单name", trigger: "blur" }],
|
||||
path: [{ required: true, message: '请输入菜单name', trigger: 'blur' }],
|
||||
component: [
|
||||
{ required: true, message: "请输入文件路径", trigger: "blur" }
|
||||
{ required: true, message: '请输入文件路径', trigger: 'blur' }
|
||||
],
|
||||
"meta.title": [
|
||||
{ required: true, message: "请输入菜单展示名称", trigger: "blur" }
|
||||
'meta.title': [
|
||||
{ required: true, message: '请输入菜单展示名称', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
isEdit: false,
|
||||
test: ""
|
||||
};
|
||||
test: ''
|
||||
}
|
||||
},
|
||||
components: {
|
||||
icon
|
||||
async created() {
|
||||
this.pageSize = 999
|
||||
await this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
addParameter(form) {
|
||||
if (!form.parameters) {
|
||||
this.$set(form, "parameters", []);
|
||||
this.$set(form, 'parameters', [])
|
||||
}
|
||||
form.parameters.push({
|
||||
type: "query",
|
||||
key: "",
|
||||
value: ""
|
||||
});
|
||||
type: 'query',
|
||||
key: '',
|
||||
value: ''
|
||||
})
|
||||
},
|
||||
deleteParameter(parameters, index) {
|
||||
parameters.splice(index, 1);
|
||||
parameters.splice(index, 1)
|
||||
},
|
||||
changeName() {
|
||||
this.form.path = this.form.name;
|
||||
this.form.path = this.form.name
|
||||
},
|
||||
setOptions() {
|
||||
this.menuOption = [
|
||||
{
|
||||
ID: "0",
|
||||
title: "根目录"
|
||||
ID: '0',
|
||||
title: '根目录'
|
||||
}
|
||||
];
|
||||
this.setMenuOptions(this.tableData, this.menuOption, false);
|
||||
]
|
||||
this.setMenuOptions(this.tableData, this.menuOption, false)
|
||||
},
|
||||
setMenuOptions(menuData, optionsData, disabled) {
|
||||
menuData &&
|
||||
@@ -270,143 +274,140 @@ export default {
|
||||
const option = {
|
||||
title: item.meta.title,
|
||||
ID: String(item.ID),
|
||||
disabled: disabled || item.ID == this.form.ID,
|
||||
disabled: disabled || item.ID === this.form.ID,
|
||||
children: []
|
||||
};
|
||||
}
|
||||
this.setMenuOptions(
|
||||
item.children,
|
||||
option.children,
|
||||
disabled || item.ID == this.form.ID
|
||||
);
|
||||
optionsData.push(option);
|
||||
disabled || item.ID === this.form.ID
|
||||
)
|
||||
optionsData.push(option)
|
||||
} else {
|
||||
const option = {
|
||||
title: item.meta.title,
|
||||
ID: String(item.ID),
|
||||
disabled: disabled || item.ID == this.form.ID
|
||||
};
|
||||
optionsData.push(option);
|
||||
disabled: disabled || item.ID === this.form.ID
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
handleClose(done) {
|
||||
this.initForm();
|
||||
done();
|
||||
this.initForm()
|
||||
done()
|
||||
},
|
||||
// 懒加载子菜单
|
||||
load(tree, treeNode, resolve) {
|
||||
resolve([
|
||||
{
|
||||
id: 31,
|
||||
date: "2016-05-01",
|
||||
name: "王小虎",
|
||||
address: "上海市普陀区金沙江路 1519 弄"
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1519 弄'
|
||||
},
|
||||
{
|
||||
id: 32,
|
||||
date: "2016-05-01",
|
||||
name: "王小虎",
|
||||
address: "上海市普陀区金沙江路 1519 弄"
|
||||
date: '2016-05-01',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1519 弄'
|
||||
}
|
||||
]);
|
||||
])
|
||||
},
|
||||
// 删除菜单
|
||||
deleteMenu(ID) {
|
||||
this.$confirm("此操作将永久删除所有角色下该菜单, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
this.$confirm('此操作将永久删除所有角色下该菜单, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
const res = await deleteBaseMenu({ ID });
|
||||
if (res.code == 0) {
|
||||
.then(async() => {
|
||||
const res = await deleteBaseMenu({ ID })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功!"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功!'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: "info",
|
||||
message: "已取消删除"
|
||||
});
|
||||
});
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
})
|
||||
})
|
||||
},
|
||||
// 初始化弹窗内表格方法
|
||||
initForm() {
|
||||
this.checkFlag = false;
|
||||
this.$refs.menuForm.resetFields();
|
||||
this.checkFlag = false
|
||||
this.$refs.menuForm.resetFields()
|
||||
this.form = {
|
||||
ID: 0,
|
||||
path: "",
|
||||
name: "",
|
||||
hidden: "",
|
||||
parentId: "",
|
||||
component: "",
|
||||
path: '',
|
||||
name: '',
|
||||
hidden: '',
|
||||
parentId: '',
|
||||
component: '',
|
||||
meta: {
|
||||
title: "",
|
||||
icon: "",
|
||||
title: '',
|
||||
icon: '',
|
||||
defaultMenu: false,
|
||||
keepAlive: ""
|
||||
keepAlive: ''
|
||||
}
|
||||
};
|
||||
}
|
||||
},
|
||||
// 关闭弹窗
|
||||
closeDialog() {
|
||||
this.initForm();
|
||||
this.dialogFormVisible = false;
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
},
|
||||
// 添加menu
|
||||
async enterDialog() {
|
||||
this.$refs.menuForm.validate(async valid => {
|
||||
if (valid) {
|
||||
let res;
|
||||
let res
|
||||
if (this.isEdit) {
|
||||
res = await updateBaseMenu(this.form);
|
||||
res = await updateBaseMenu(this.form)
|
||||
} else {
|
||||
res = await addBaseMenu(this.form);
|
||||
res = await addBaseMenu(this.form)
|
||||
}
|
||||
if (res.code == 0) {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: this.isEdit ? "编辑成功" : "添加成功!"
|
||||
});
|
||||
this.getTableData();
|
||||
type: 'success',
|
||||
message: this.isEdit ? '编辑成功' : '添加成功!'
|
||||
})
|
||||
this.getTableData()
|
||||
}
|
||||
this.initForm();
|
||||
this.dialogFormVisible = false;
|
||||
this.initForm()
|
||||
this.dialogFormVisible = false
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
// 添加菜单方法，id为 0则为添加根菜单
|
||||
addMenu(id) {
|
||||
this.dialogTitle = "新增菜单";
|
||||
this.form.parentId = String(id);
|
||||
this.isEdit = false;
|
||||
this.setOptions();
|
||||
this.dialogFormVisible = true;
|
||||
this.dialogTitle = '新增菜单'
|
||||
this.form.parentId = String(id)
|
||||
this.isEdit = false
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
// 修改菜单方法
|
||||
async editMenu(id) {
|
||||
this.dialogTitle = "编辑菜单";
|
||||
const res = await getBaseMenuById({ id });
|
||||
this.form = res.data.menu;
|
||||
this.isEdit = true;
|
||||
this.setOptions();
|
||||
this.dialogFormVisible = true;
|
||||
this.dialogTitle = '编辑菜单'
|
||||
const res = await getBaseMenuById({ id })
|
||||
this.form = res.data.menu
|
||||
this.isEdit = true
|
||||
this.setOptions()
|
||||
this.dialogFormVisible = true
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.pageSize = 999;
|
||||
await this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.button-box {
|
||||
padding: 10px 20px;
|
||||
|
||||
@@ -3,46 +3,46 @@
|
||||
<div class="search-term">
|
||||
<el-form :inline="true" :model="searchInfo" class="demo-form-inline">
|
||||
<el-form-item label="请求方法">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.method"></el-input>
|
||||
<el-input v-model="searchInfo.method" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="请求路径">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.path"></el-input>
|
||||
<el-input v-model="searchInfo.path" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item label="结果状态码">
|
||||
<el-input placeholder="搜索条件" v-model="searchInfo.status"></el-input>
|
||||
<el-input v-model="searchInfo.status" placeholder="搜索条件" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="onSubmit" type="primary">查询</el-button>
|
||||
<el-button type="primary" @click="onSubmit">查询</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-popover placement="top" v-model="deleteVisible" width="160">
|
||||
<el-popover v-model="deleteVisible" placement="top" width="160">
|
||||
<p>确定要删除吗？</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button @click="deleteVisible = false" size="mini" type="text">取消</el-button>
|
||||
<el-button @click="onDelete" size="mini" type="primary">确定</el-button>
|
||||
<el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
|
||||
<el-button size="mini" type="primary" @click="onDelete">确定</el-button>
|
||||
</div>
|
||||
<el-button icon="el-icon-delete" size="mini" slot="reference" type="danger">批量删除</el-button>
|
||||
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger">批量删除</el-button>
|
||||
</el-popover>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
@selection-change="handleSelectionChange"
|
||||
border
|
||||
ref="multipleTable"
|
||||
:data="tableData"
|
||||
border
|
||||
stripe
|
||||
style="width: 100%"
|
||||
tooltip-effect="dark"
|
||||
@selection-change="handleSelectionChange"
|
||||
>
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column label="操作人" width="140">
|
||||
<template slot-scope="scope">
|
||||
<div>{{scope.row.user.userName}}({{scope.row.user.nickName}})</div>
|
||||
<div>{{ scope.row.user.userName }}({{ scope.row.user.nickName }})</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="日期" width="180">
|
||||
<template slot-scope="scope">{{scope.row.CreatedAt|formatDate}}</template>
|
||||
<template slot-scope="scope">{{ scope.row.CreatedAt|formatDate }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态码" prop="status" width="120">
|
||||
<template slot-scope="scope">
|
||||
@@ -51,17 +51,17 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="请求ip" prop="ip" width="120"></el-table-column>
|
||||
<el-table-column label="请求方法" prop="method" width="120"></el-table-column>
|
||||
<el-table-column label="请求路径" prop="path" width="240"></el-table-column>
|
||||
<el-table-column label="请求ip" prop="ip" width="120" />
|
||||
<el-table-column label="请求方法" prop="method" width="120" />
|
||||
<el-table-column label="请求路径" prop="path" width="240" />
|
||||
<el-table-column label="请求" prop="path" width="80">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-popover placement="top-start" trigger="hover" v-if="scope.row.body">
|
||||
<el-popover v-if="scope.row.body" placement="top-start" trigger="hover">
|
||||
<div class="popover-box">
|
||||
<pre>{{fmtBody(scope.row.body)}}</pre>
|
||||
<pre>{{ fmtBody(scope.row.body) }}</pre>
|
||||
</div>
|
||||
<i class="el-icon-view" slot="reference"></i>
|
||||
<i slot="reference" class="el-icon-view" />
|
||||
</el-popover>
|
||||
|
||||
<span v-else>无</span>
|
||||
@@ -71,11 +71,11 @@
|
||||
<el-table-column label="响应" prop="path" width="80">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-popover placement="top-start" trigger="hover" v-if="scope.row.resp">
|
||||
<el-popover v-if="scope.row.resp" placement="top-start" trigger="hover">
|
||||
<div class="popover-box">
|
||||
<pre>{{fmtBody(scope.row.resp)}}</pre>
|
||||
<pre>{{ fmtBody(scope.row.resp) }}</pre>
|
||||
</div>
|
||||
<i class="el-icon-view" slot="reference"></i>
|
||||
<i slot="reference" class="el-icon-view" />
|
||||
</el-popover>
|
||||
<span v-else>无</span>
|
||||
</div>
|
||||
@@ -83,13 +83,13 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="按钮组">
|
||||
<template slot-scope="scope">
|
||||
<el-popover placement="top" v-model="scope.row.visible" width="160">
|
||||
<el-popover v-model="scope.row.visible" placement="top" width="160">
|
||||
<p>确定要删除吗？</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button @click="scope.row.visible = false" size="mini" type="text">取消</el-button>
|
||||
<el-button @click="deleteSysOperationRecord(scope.row)" size="mini" type="primary">确定</el-button>
|
||||
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
|
||||
<el-button size="mini" type="primary" @click="deleteSysOperationRecord(scope.row)">确定</el-button>
|
||||
</div>
|
||||
<el-button icon="el-icon-delete" size="mini" slot="reference" type="danger">删除</el-button>
|
||||
<el-button slot="reference" icon="el-icon-delete" size="mini" type="danger">删除</el-button>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -100,10 +100,10 @@
|
||||
:page-sizes="[10, 30, 50, 100]"
|
||||
:style="{float:'right',padding:'20px'}"
|
||||
:total="total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -112,18 +112,35 @@ import {
|
||||
deleteSysOperationRecord,
|
||||
getSysOperationRecordList,
|
||||
deleteSysOperationRecordByIds
|
||||
} from "@/api/sysOperationRecord"; // 此处请自行替换地址
|
||||
import { formatTimeToStr } from "@/utils/date";
|
||||
import infoList from "@/mixins/infoList";
|
||||
} from '@/api/sysOperationRecord' // 此处请自行替换地址
|
||||
import { formatTimeToStr } from '@/utils/date'
|
||||
import infoList from '@/mixins/infoList'
|
||||
|
||||
export default {
|
||||
name: "SysOperationRecord",
|
||||
name: 'SysOperationRecord',
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time !== null && time !== '') {
|
||||
var date = new Date(time)
|
||||
return formatTimeToStr(date, 'yyyy-MM-dd hh:mm:ss')
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool !== null) {
|
||||
return bool ? '是' : '否'
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [infoList],
|
||||
data() {
|
||||
return {
|
||||
listApi: getSysOperationRecordList,
|
||||
dialogFormVisible: false,
|
||||
type: "",
|
||||
type: '',
|
||||
deleteVisible: false,
|
||||
multipleSelection: [],
|
||||
formData: {
|
||||
@@ -136,80 +153,63 @@ export default {
|
||||
error_message: null,
|
||||
user_id: null
|
||||
}
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
formatDate: function(time) {
|
||||
if (time != null && time != "") {
|
||||
var date = new Date(time);
|
||||
return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
},
|
||||
formatBoolean: function(bool) {
|
||||
if (bool != null) {
|
||||
return bool ? "是" : "否";
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData()
|
||||
},
|
||||
methods: {
|
||||
//条件搜索前端看此方法
|
||||
// 条件搜索前端看此方法
|
||||
onSubmit() {
|
||||
this.page = 1;
|
||||
this.pageSize = 10;
|
||||
this.getTableData();
|
||||
this.page = 1
|
||||
this.pageSize = 10
|
||||
this.getTableData()
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
this.multipleSelection = val
|
||||
},
|
||||
async onDelete() {
|
||||
const ids = [];
|
||||
const ids = []
|
||||
this.multipleSelection &&
|
||||
this.multipleSelection.map(item => {
|
||||
ids.push(item.ID);
|
||||
});
|
||||
const res = await deleteSysOperationRecordByIds({ ids });
|
||||
if (res.code == 0) {
|
||||
ids.push(item.ID)
|
||||
})
|
||||
const res = await deleteSysOperationRecordByIds({ ids })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功"
|
||||
});
|
||||
if (this.tableData.length == ids.length && this.page > 1) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
})
|
||||
if (this.tableData.length === ids.length && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.deleteVisible = false;
|
||||
this.getTableData();
|
||||
this.deleteVisible = false
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
async deleteSysOperationRecord(row) {
|
||||
row.visible = false;
|
||||
const res = await deleteSysOperationRecord({ ID: row.ID });
|
||||
if (res.code == 0) {
|
||||
row.visible = false
|
||||
const res = await deleteSysOperationRecord({ ID: row.ID })
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: "success",
|
||||
message: "删除成功"
|
||||
});
|
||||
if (this.tableData.length == 1 && this.page > 1 ) {
|
||||
this.page--;
|
||||
type: 'success',
|
||||
message: '删除成功'
|
||||
})
|
||||
if (this.tableData.length === 1 && this.page > 1) {
|
||||
this.page--
|
||||
}
|
||||
this.getTableData();
|
||||
this.getTableData()
|
||||
}
|
||||
},
|
||||
fmtBody(value) {
|
||||
try {
|
||||
return JSON.parse(value);
|
||||
return JSON.parse(value)
|
||||
} catch (err) {
|
||||
return value;
|
||||
return value
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTableData();
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@@ -236,4 +236,4 @@ export default {
|
||||
.popover-box::-webkit-scrollbar {
|
||||
display: none; /* Chrome Safari */
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,40 +1,40 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="button-box clearflex">
|
||||
<el-button @click="addUser" type="primary">新增用户</el-button>
|
||||
<el-button type="primary" @click="addUser">新增用户</el-button>
|
||||
</div>
|
||||
<el-table :data="tableData" border stripe>
|
||||
<el-table-column label="头像" min-width="50">
|
||||
<template slot-scope="scope">
|
||||
<div :style="{'textAlign':'center'}">
|
||||
<CustomPic :picSrc="scope.row.headerImg" />
|
||||
<CustomPic :pic-src="scope.row.headerImg" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="uuid" min-width="250" prop="uuid"></el-table-column>
|
||||
<el-table-column label="用户名" min-width="150" prop="userName"></el-table-column>
|
||||
<el-table-column label="昵称" min-width="150" prop="nickName"></el-table-column>
|
||||
<el-table-column label="uuid" min-width="250" prop="uuid" />
|
||||
<el-table-column label="用户名" min-width="150" prop="userName" />
|
||||
<el-table-column label="昵称" min-width="150" prop="nickName" />
|
||||
<el-table-column label="用户角色" min-width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-cascader
|
||||
@change="changeAuthority(scope.row)"
|
||||
v-model="scope.row.authority.authorityId"
|
||||
:options="authOptions"
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
filterable
|
||||
></el-cascader>
|
||||
@change="changeAuthority(scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" min-width="150">
|
||||
<template slot-scope="scope">
|
||||
<el-popover placement="top" width="160" v-model="scope.row.visible">
|
||||
<el-popover v-model="scope.row.visible" placement="top" width="160">
|
||||
<p>确定要删除此用户吗</p>
|
||||
<div style="text-align: right; margin: 0">
|
||||
<el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
|
||||
<el-button type="primary" size="mini" @click="deleteUser(scope.row)">确定</el-button>
|
||||
</div>
|
||||
<el-button type="danger" icon="el-icon-delete" size="small" slot="reference">删除</el-button>
|
||||
<el-button slot="reference" type="danger" icon="el-icon-delete" size="small">删除</el-button>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@@ -45,25 +45,25 @@
|
||||
:page-sizes="[10, 30, 50, 100]"
|
||||
:style="{float:'right',padding:'20px'}"
|
||||
:total="total"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
></el-pagination>
|
||||
/>
|
||||
|
||||
<el-dialog :visible.sync="addUserDialog" custom-class="user-dialog" title="新增用户">
|
||||
<el-form :rules="rules" ref="userForm" :model="userInfo">
|
||||
<el-form ref="userForm" :rules="rules" :model="userInfo">
|
||||
<el-form-item label="用户名" label-width="80px" prop="username">
|
||||
<el-input v-model="userInfo.username"></el-input>
|
||||
<el-input v-model="userInfo.username" />
|
||||
</el-form-item>
|
||||
<el-form-item label="密码" label-width="80px" prop="password">
|
||||
<el-input v-model="userInfo.password"></el-input>
|
||||
<el-input v-model="userInfo.password" />
|
||||
</el-form-item>
|
||||
<el-form-item label="别名" label-width="80px" prop="nickName">
|
||||
<el-input v-model="userInfo.nickName"></el-input>
|
||||
<el-input v-model="userInfo.nickName" />
|
||||
</el-form-item>
|
||||
<el-form-item label="头像" label-width="80px">
|
||||
<div style="display:inline-block" @click="openHeaderChange">
|
||||
<img class="header-img-box" v-if="userInfo.headerImg" :src="userInfo.headerImg" />
|
||||
<img v-if="userInfo.headerImg" class="header-img-box" :src="userInfo.headerImg">
|
||||
<div v-else class="header-img-box">从媒体库选择</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
@@ -74,37 +74,36 @@
|
||||
:show-all-levels="false"
|
||||
:props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
|
||||
filterable
|
||||
></el-cascader>
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="dialog-footer" slot="footer">
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeAddUserDialog">取 消</el-button>
|
||||
<el-button @click="enterAddUserDialog" type="primary">确 定</el-button>
|
||||
<el-button type="primary" @click="enterAddUserDialog">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<ChooseImg ref="chooseImg" :target="userInfo" :targetKey="`headerImg`"/>
|
||||
<ChooseImg ref="chooseImg" :target="userInfo" :target-key="`headerImg`" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
// 获取列表内容封装在mixins内部 getTableData方法 初始化已封装完成
|
||||
const path = process.env.VUE_APP_BASE_API;
|
||||
const path = process.env.VUE_APP_BASE_API
|
||||
import {
|
||||
getUserList,
|
||||
setUserAuthority,
|
||||
register,
|
||||
deleteUser
|
||||
} from "@/api/user";
|
||||
import { getAuthorityList } from "@/api/authority";
|
||||
import infoList from "@/mixins/infoList";
|
||||
import { mapGetters } from "vuex";
|
||||
import CustomPic from "@/components/customPic";
|
||||
import ChooseImg from "@/components/chooseImg";
|
||||
} from '@/api/user'
|
||||
import { getAuthorityList } from '@/api/authority'
|
||||
import infoList from '@/mixins/infoList'
|
||||
import { mapGetters } from 'vuex'
|
||||
import CustomPic from '@/components/customPic'
|
||||
import ChooseImg from '@/components/chooseImg'
|
||||
export default {
|
||||
name: "Api",
|
||||
name: 'Api',
|
||||
components: { CustomPic, ChooseImg },
|
||||
mixins: [infoList],
|
||||
components: { CustomPic,ChooseImg },
|
||||
data() {
|
||||
return {
|
||||
listApi: getUserList,
|
||||
@@ -112,40 +111,45 @@ export default {
|
||||
authOptions: [],
|
||||
addUserDialog: false,
|
||||
userInfo: {
|
||||
username: "",
|
||||
password: "",
|
||||
nickName: "",
|
||||
headerImg: "",
|
||||
authorityId: ""
|
||||
username: '',
|
||||
password: '',
|
||||
nickName: '',
|
||||
headerImg: '',
|
||||
authorityId: ''
|
||||
},
|
||||
rules: {
|
||||
username: [
|
||||
{ required: true, message: "请输入用户名", trigger: "blur" },
|
||||
{ min: 5, message: "最低5位字符", trigger: "blur" }
|
||||
{ required: true, message: '请输入用户名', trigger: 'blur' },
|
||||
{ min: 5, message: '最低5位字符', trigger: 'blur' }
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: "请输入用户密码", trigger: "blur" },
|
||||
{ min: 6, message: "最低6位字符", trigger: "blur" }
|
||||
{ required: true, message: '请输入用户密码', trigger: 'blur' },
|
||||
{ min: 6, message: '最低6位字符', trigger: 'blur' }
|
||||
],
|
||||
nickName: [
|
||||
{ required: true, message: "请输入用户昵称", trigger: "blur" }
|
||||
{ required: true, message: '请输入用户昵称', trigger: 'blur' }
|
||||
],
|
||||
authorityId: [
|
||||
{ required: true, message: "请选择用户角色", trigger: "blur" }
|
||||
{ required: true, message: '请选择用户角色', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters("user", ["token"])
|
||||
...mapGetters('user', ['token'])
|
||||
},
|
||||
async created() {
|
||||
this.getTableData()
|
||||
const res = await getAuthorityList({ page: 1, pageSize: 999 })
|
||||
this.setOptions(res.data.list)
|
||||
},
|
||||
methods: {
|
||||
openHeaderChange(){
|
||||
openHeaderChange() {
|
||||
this.$refs.chooseImg.open()
|
||||
},
|
||||
setOptions(authData) {
|
||||
this.authOptions = [];
|
||||
this.setAuthorityOptions(authData, this.authOptions);
|
||||
this.authOptions = []
|
||||
this.setAuthorityOptions(authData, this.authOptions)
|
||||
},
|
||||
setAuthorityOptions(AuthorityData, optionsData) {
|
||||
AuthorityData &&
|
||||
@@ -155,66 +159,61 @@ export default {
|
||||
authorityId: item.authorityId,
|
||||
authorityName: item.authorityName,
|
||||
children: []
|
||||
};
|
||||
this.setAuthorityOptions(item.children, option.children);
|
||||
optionsData.push(option);
|
||||
}
|
||||
this.setAuthorityOptions(item.children, option.children)
|
||||
optionsData.push(option)
|
||||
} else {
|
||||
const option = {
|
||||
authorityId: item.authorityId,
|
||||
authorityName: item.authorityName
|
||||
};
|
||||
optionsData.push(option);
|
||||
}
|
||||
optionsData.push(option)
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
async deleteUser(row) {
|
||||
const res = await deleteUser({ id: row.ID });
|
||||
if (res.code == 0) {
|
||||
this.getTableData();
|
||||
row.visible = false;
|
||||
const res = await deleteUser({ id: row.ID })
|
||||
if (res.code === 0) {
|
||||
this.getTableData()
|
||||
row.visible = false
|
||||
}
|
||||
},
|
||||
async enterAddUserDialog() {
|
||||
this.$refs.userForm.validate(async valid => {
|
||||
if (valid) {
|
||||
const res = await register(this.userInfo);
|
||||
if (res.code == 0) {
|
||||
this.$message({ type: "success", message: "创建成功" });
|
||||
const res = await register(this.userInfo)
|
||||
if (res.code === 0) {
|
||||
this.$message({ type: 'success', message: '创建成功' })
|
||||
}
|
||||
await this.getTableData();
|
||||
this.closeAddUserDialog();
|
||||
await this.getTableData()
|
||||
this.closeAddUserDialog()
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
closeAddUserDialog() {
|
||||
this.$refs.userForm.resetFields();
|
||||
this.addUserDialog = false;
|
||||
this.$refs.userForm.resetFields()
|
||||
this.addUserDialog = false
|
||||
},
|
||||
handleAvatarSuccess(res) {
|
||||
this.userInfo.headerImg = res.data.file.url;
|
||||
this.userInfo.headerImg = res.data.file.url
|
||||
},
|
||||
addUser() {
|
||||
this.addUserDialog = true;
|
||||
this.addUserDialog = true
|
||||
},
|
||||
async changeAuthority(row) {
|
||||
const res = await setUserAuthority({
|
||||
uuid: row.uuid,
|
||||
authorityId: row.authority.authorityId
|
||||
});
|
||||
if (res.code == 0) {
|
||||
this.$message({ type: "success", message: "角色设置成功" });
|
||||
})
|
||||
if (res.code === 0) {
|
||||
this.$message({ type: 'success', message: '角色设置成功' })
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.getTableData();
|
||||
const res = await getAuthorityList({ page: 1, pageSize: 999 });
|
||||
this.setOptions(res.data.list);
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
|
||||
<style lang="scss">
|
||||
.button-box {
|
||||
padding: 10px 20px;
|
||||
.el-button {
|
||||
@@ -251,4 +250,4 @@ export default {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user