179 lines
4.1 KiB
Vue
179 lines
4.1 KiB
Vue
<template>
|
|
<div class="manage-container">
|
|
<div class="manage-button">
|
|
<el-button
|
|
v-if="isBtnPerm('/sysDict/insertDictType')"
|
|
type="primary"
|
|
size="small"
|
|
@click="handleAdd"
|
|
>
|
|
添加字典
|
|
</el-button>
|
|
</div>
|
|
<el-table :data="dictData" border stripe style="width: 100%">
|
|
<el-table-column
|
|
prop="id"
|
|
label="ID"
|
|
width="60"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="dictName"
|
|
label="字典名称"
|
|
width="400"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column
|
|
prop="dictType"
|
|
label="字典类型"
|
|
width="400"
|
|
align="center"
|
|
></el-table-column>
|
|
<el-table-column fixed="right" label="操作" align="center">
|
|
<template #default="{ row }">
|
|
<el-button
|
|
v-if="isBtnPerm('/sysDict/shuju')"
|
|
type="text"
|
|
@click="dictDatas(row)"
|
|
>
|
|
数据
|
|
</el-button>
|
|
<el-button
|
|
v-if="isBtnPerm('/sysDict/updateDictType')"
|
|
type="text"
|
|
@click="handleEdit(row)"
|
|
>
|
|
编辑
|
|
</el-button>
|
|
<el-button
|
|
v-if="isBtnPerm('/sysDict/removeDictType')"
|
|
type="text"
|
|
@click="handleDelete(row)"
|
|
>
|
|
删除
|
|
</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<dict-add ref="edit"></dict-add>
|
|
<el-pagination
|
|
:background="background"
|
|
:current-page="queryForm.page"
|
|
:layout="layout"
|
|
:page-size="queryForm.size"
|
|
:total="total"
|
|
style="text-align: right"
|
|
@current-change="handleCurrentChange"
|
|
@size-change="handleSizeChange"
|
|
></el-pagination>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { doDelete, getList } from '@/api/sysdict';
|
|
import dictAdd from './add';
|
|
export default {
|
|
name: 'Index',
|
|
components: {
|
|
dictAdd,
|
|
},
|
|
data() {
|
|
return {
|
|
dictData: [],
|
|
lazy: true,
|
|
activeName: 'first',
|
|
layout: 'total, sizes, prev, pager, next, jumper',
|
|
background: true,
|
|
total: 0,
|
|
queryForm: {
|
|
page: 1,
|
|
size: 20,
|
|
name: '',
|
|
},
|
|
};
|
|
},
|
|
computed: {
|
|
height() {
|
|
return 500;
|
|
},
|
|
},
|
|
created() {
|
|
this.fetchData();
|
|
},
|
|
methods: {
|
|
async fetchData() {
|
|
this.listLoading = true;
|
|
const { data } = await getList(this.queryForm);
|
|
this.dictData = data.items;
|
|
this.total = data.total;
|
|
setTimeout(() => {
|
|
this.listLoading = false;
|
|
}, 500);
|
|
},
|
|
handleAdd() {
|
|
this.$refs['edit'].dictEdit();
|
|
},
|
|
handleEdit(row) {
|
|
this.$refs['edit'].dictEdit(row);
|
|
},
|
|
dictDatas(row) {
|
|
this.$router.push({
|
|
path: 'dictdata',
|
|
query: {
|
|
dictId: row.id,
|
|
page: this.queryForm.page,
|
|
size: this.queryForm.size,
|
|
},
|
|
});
|
|
},
|
|
assignRole(row) {
|
|
this.$refs['index'].manageRole(row);
|
|
},
|
|
handleQuery() {
|
|
this.queryForm.page = 1;
|
|
this.fetchData();
|
|
},
|
|
handleSizeChange(val) {
|
|
this.queryForm.size = val;
|
|
this.fetchData();
|
|
},
|
|
handleCurrentChange(val) {
|
|
this.queryForm.page = val;
|
|
this.fetchData();
|
|
},
|
|
handleDelete(row) {
|
|
const that = this;
|
|
if (row.id) {
|
|
this.$confirm('你确定要删除当前项吗?', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning',
|
|
})
|
|
.then(() => {
|
|
const { msg } = doDelete({ dictTypeId: row.id });
|
|
this.$message({
|
|
type: 'success',
|
|
message: msg == undefined ? '删除成功' : msg,
|
|
});
|
|
setTimeout(function () {
|
|
that.fetchData();
|
|
}, 1000);
|
|
})
|
|
.catch(() => {
|
|
this.$message({
|
|
type: 'info',
|
|
message: '已取消删除',
|
|
});
|
|
});
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.manage-button {
|
|
margin-bottom: 30px;
|
|
}
|
|
</style>
|