sunshine7058
/
ETL-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix():完善字典表功能

ruoyi_test
sunshine7058 2024-04-28 09:59:51 +08:00
parent f2bdb0e4d2
commit ca87c5e438
6 changed files with 269 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/api/data/dictData.js 100644
View File

@ -0,0 +1,27 @@
import request from '@/utils/request'
// 添加字典数据
export function addDictData(data) {
return request({
url: '/data/source/dictData/addDictData',
method: 'post',
data: data
})
}
// 修改字典数据
export function updateDictData(data) {
return request({
url: '/data/source/dictData/editDictData',
method: 'post',
data: data
})
}
// 删除字典数据
export function delDictData(id) {
return request({
url: '/data/source/dictData/delDictData/' + id,
method: 'get'
})
}

26
src/api/data/dictType.js 100644
View File

@ -0,0 +1,26 @@
import request from '@/utils/request'
// 根据数据源id查询字典类型数据
export function getDictDataList(id) {
return request({
url: '/data/source/dictType/getDictDataList/' + id,
method: 'get'
})
}
// 添加字典类型
export function addDictType(data) {
return request({
url: '/data/source/dictType/addDictType',
method: 'post',
data: data
})
}
// 删除字典类型
export function delDictType(id) {
return request({
url: '/data/source/dictType/delDictType/' + id,
method: 'get'
})
}

10
src/api/data/source.js
View File

@ -109,10 +109,12 @@ export function getTableDataCount(id) {
})
}
// 根据数据源id查询字典类型数据
export function getDictDataList(id) {
// 修改字段是否为字典
export function updTableData(data) {
return request({
url: '/source/dictType/getDictDataList/' + id,
method: 'get'
url: '/data/source/updTableData',
method: 'post',
data: data
})
}

67
src/views/data/assetStructure/dashboard/OverallAssetStructure.vue
View File

@ -53,13 +53,9 @@
placement="left"
width="200"
trigger="hover">
<el-table :data="[
{ label: '男', value: '1' },
{ label: '女', value: '2' },
{ label: '未知', value: '0' },
]">
<el-table-column property="label" label="字典标签"/>
<el-table-column property="value" label="字典值"/>
<el-table :formatter="selectDictData(scope.row.dictKey)" :data="checkedDictData">
<el-table-column property="dictLabel" label="字典标签"/>
<el-table-column property="dictValue" label="字典值"/>
</el-table>
<el-tag slot="reference">{{ scope.row.dictKey }}</el-tag>
</el-popover>
@ -147,16 +143,17 @@
<el-row v-if="form.isDict === 'Y'">
<el-col :span="24">
<el-form-item label="字典">
<el-select v-model="form.dictKey">
<el-option v-for="(value, key) in dictMap" :key="key" :label="key" :value="key"></el-option>
<el-select v-model="form.dictKey" @change="selectedDict">
<el-option v-for="(dict,index) in dictMap" :key="dict.id" :label="dict.dictType"
:value="dict.dictType"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item>
<el-table :data="dictMap[form.dictKey]" striped border>
<el-table-column property="label" label="字典标签"/>
<el-table-column property="val" label="字典值"/>
<el-table :data="checkedDictData" striped border>
<el-table-column property="dictLabel" label="字典标签"/>
<el-table-column property="dictValue" label="字典值"/>
</el-table>
</el-form-item>
</el-col>
@ -164,13 +161,14 @@
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="formStatus = false">取 消</el-button>
<el-button type="primary" @click="formStatus = false">确 定</el-button>
<el-button type="primary" @click="editTableData">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {selectTableData} from "@/api/data/source";
import {selectTableData, updTableData} from "@/api/data/source";
import {getDictDataList} from "@/api/data/dictType";
export default {
name: 'OverallAssetStructure',
@ -178,7 +176,8 @@ export default {
childrenParams: {
type: Object,
default: null
}
},
assetId: 0
},
watch: {
childrenParams: {
@ -196,17 +195,8 @@ export default {
tableDataList: [],
form: {},
formStatus: false,
dictMap: {
"system_sex": [
{label: '男', val: '1', isEdit: false},
{label: '女', val: '2', isEdit: false},
{label: '未知', val: '0', isEdit: false},
],
"system_y_n": [
{label: '是', val: '1', isEdit: false},
{label: '否', val: '0', isEdit: false}
],
}
checkedDictData: [],
dictMap: []
}
},
methods: {
@ -218,7 +208,30 @@ export default {
update(row) {
this.form = row;
this.formStatus = true;
}
},
selectedDict() {
this.checkedDictData = this.dictMap.filter(dict => dict.dictType === this.form.dictKey)[0].dictData ?? []
},
selectDictData(dictKey) {
this.checkedDictData = this.dictMap.filter(dict => dict.dictType === dictKey)[0].dictData ?? []
},
editTableData() {
if (this.form.isDict === 'N') {
this.form.dictKey = null;
}
updTableData(this.form).then(res => {
this.$message.success("修改成功");
this.formStatus = false;
})
},
getDictData() {
getDictDataList(this.assetId).then(res => {
this.dictMap = res.data
})
},
},
created() {
this.getDictData()
}
}
</script>

179
src/views/data/assetStructure/dashboard/OverallSpecificAssets.vue
View File

@ -42,30 +42,23 @@
content="这个字典是数据资产项目当中的字典内容，而不是本项目当中的字典内容。主要作用为数据清洗过程中数据字典映射作用">
<i class="el-icon-question" slot="reference"></i>
</el-popover>
<el-popover
placement="right"
width="400"
trigger="click">
<el-row :gutter="20">
<el-col :span="18">
<el-input v-model="dictAddName"></el-input>
</el-col>
<el-col :span="6">
<el-button @click="addDict">确定</el-button>
</el-col>
</el-row>
<el-button style="float: right; padding: 3px 0" type="text" slot="reference">新增字典</el-button>
</el-popover>
<el-button style="float: right; padding: 3px 0" type="text" @click="handleAdd">新增字典</el-button>
</div>
<!-- <el-empty v-if="dictMap.length===0" description="暂无字典"></el-empty>-->
<el-row :gutter="20">
<el-col v-for="(dict,index) in dictDataList" :md="8" :sm="24" :xs="12">
<el-col v-for="(dict,index) in dictMap" :md="8" :sm="24" :xs="12">
<el-card class="box-card" style="height: 300px">
<div slot="header" class="clearfix">
<span>{{dict.dictName+'('+dict.dictType+')'}}</span>
<span>{{ dict.dictName + '(' + dict.dictType + ')' }}</span>
<el-button style="float: right; padding: 2px 2px"
type="text"
@click="handleDel(dict.dictType,dict.id)"
>删除
</el-button>
<el-button style="float: right; padding: 3px 0"
type="text"
@click="dict.dictData.push({ dictLabel: null, dictValue: null, isEdit: true })"
>新增
>新增数据
</el-button>
</div>
<el-table :data="dict.dictData" style="width: 100%" height="280px">
@ -87,13 +80,19 @@
v-if="!scope.row.isEdit"
size="mini"
type="text"
icon="el-icon-edit"
@click="scope.row.isEdit = true"
@click="$set(scope.row,'isEdit',true)"
>修改
</el-button>
<el-button
v-show="!scope.row.isEdit"
size="mini"
type="text"
@click="delConfirm(scope.row)"
>删除
</el-button>
<el-button
v-if="scope.row.isEdit"
@click="editConfirm(scope.row)"
@click="editConfirm(scope.row,dict.id)"
size="mini"
type="text"
icon="el-icon-finished"
@ -106,27 +105,45 @@
</el-col>
</el-row>
</el-card>
</el-col>
<!-- 添加字典对话框 -->
<el-dialog title="添加字典类型" :visible.sync="open" width="500px">
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="字典名称" prop="dictName">
<el-input v-model="form.dictName" placeholder="请输入字典名称"/>
</el-form-item>
<el-form-item label="字典类型" prop="dictType">
<el-input v-model="form.dictType" placeholder="请输入字典类型"/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入内容" type="textarea"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="addDict">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-col :span="24" style="margin-top: 20px">
<el-tabs v-model="activeName" type="border-card" @tab-click="checkTableName">
<el-tab-pane v-for="children in childrenList" :label="children.name+'('+children.annotation+')'"
:name="children.name">
<overall-asset-structure v-if="children.name === childrenParams.name" :children-params="childrenParams"/>
<overall-asset-structure v-if="children.name === childrenParams.name" :children-params="childrenParams" :asset-id="assetId"/>
</el-tab-pane>
</el-tabs>
</el-col>
</el-row>
</template>
<script>
import CountTo from 'vue-count-to'
import OverallAssetStructure from './OverallAssetStructure.vue'
import {addDictData, delDictData, updateDictData} from "@/api/data/dictData";
import {addDictType, delDictType, getDictDataList} from "@/api/data/dictType";
export default {
props: {
count:{
count: {
assetStructureCount: null,
assetStructureTableCount: null,
assetStructureTableDataCount: null
@ -139,55 +156,135 @@ export default {
type: String,
default: "-"
},
dictDataList: {
type: Array,
default: []
}
assetId: 0
},
data() {
return {
activeName: null,
dictAddName: null,
// dictMap: [],
childrenParams: null
dictMap: [],
childrenParams: null,
open: false,
// 表单参数
form: {},
// 表单校验
rules: {
dictName: [
{required: true, message: "字典名称不能为空", trigger: "blur"}
],
dictType: [
{required: true, message: "字典类型不能为空", trigger: "blur"}
]
}
}
},
components: {
OverallAssetStructure,
CountTo
},
watch: {
assetId: {
handler(val) {
if (val !== null) {
this.initDictData(val)
}
},
immediate: true
}
},
methods: {
init() {
this.activeName = this.childrenList[0].name
this.childrenParams = this.childrenList[0]
},
initDictData(id) {
getDictDataList(id).then(res => {
this.dictMap = res.data
})
},
getDictData() {
getDictDataList(this.assetId).then(res => {
this.dictMap = res.data
})
},
checkTableName(checkTab) {
console.log(checkTab)
this.childrenParams = this.childrenList.findLast(item => item.name === checkTab.name)
console.log(this.childrenParams)
},
editConfirm(row) {
if (!row.label || !row.val) {
// 添加字典按钮
handleAdd() {
this.reset()
this.open = true
},
addDict() {
this.form.assetId = this.assetId
addDictType(this.form).then(res => {
this.$message.success("添加成功")
this.getDictData()
this.open = false;
})
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
delConfirm(row) {
this.$modal.confirm('是否确认删除字典标签为"' + row.dictLabel + '"的数据项？').then(function () {
return delDictData(row.dictCode);
}).then(() => {
this.getDictData()
this.$message.success("删除成功");
});
},
editConfirm(row, id) {
console.log(row)
if (!row.dictLabel || !row.dictValue) {
this.$message.error('字典标签或字典值，不可为空');
return;
}
if (row.dictCode === undefined) {
//新增
row['dictTypeId'] = id;
addDictData(row).then(res => {
this.$message.success("新增成功");
this.getDictData()
});
} else {
//修改
updateDictData(row).then(res => {
this.$message.success("修改成功");
this.getDictData()
});
}
row.isEdit = false;
},
addDict() {
if (!this.dictAddName) {
this.$message.error('数据字典，不可为空');
return;
}
this.dictMap[this.dictAddName] = []
this.dictAddName = null
handleDel(dictType, id) {
this.$modal.confirm('是否确认删除字典类型为"' + dictType + '"的数据项？').then(function () {
return delDictType(id);
}).then(() => {
this.$message.success("删除成功");
this.getDictData()
})
},
handleSetLineChartData(type) {
this.$emit('handleSetLineChartData', type)
},
// 表单重置
reset() {
this.form = {
id: undefined,
dictName: undefined,
dictType: undefined,
assetId: undefined,
remark: undefined
};
this.resetForm("form");
}
},
created() {
this.init()
this.getDictData()
}
}
</script>

42
src/views/data/assetStructure/index.vue
View File

@ -23,9 +23,9 @@
<el-main>
<OverallAssets v-if="showAssets == null" :count="count"/>
<overall-specific-assets v-if="showAssets === 'dataSource'" :children-list="childrenList" :count="count"
:dict-data-list="dictDataList" :title="title"/>
:assetId="assetId" :title="title"/>
<overall-asset-structure v-if="showAssets === 'dataTable'" :children-params="childrenParams"
:tableDataList="tableDataList"/>
:asset-id="assetId"/>
</el-main>
</el-container>
</el-container>
@ -38,6 +38,7 @@ import {
addTableData,
getAssetList,
getChildrenList,
getTableDataCount,
selectTableData,
selectTableDataCount
} from "@/api/data/source";
@ -52,11 +53,11 @@ export default {
children: 'childrenList',
label: 'name'
},
dictDataList: [],
assetStructureList: [],
childrenList: [],
tableDataList: [],
childrenParams: null,
assetId: 0,
showAssets: null,
title: null,
showTable: {
@ -71,19 +72,24 @@ export default {
}
},
methods: {
expandTable(node, resolve) {
console.log(node)
console.log(resolve)
if (node.level === 0) return resolve(this.assetStructureList);
const {data} = node;
if (data.type === 'dataSource') {
getTableDataCount(data.id).then(res => {
this.count = res.data
})
getDictDataList(data.id).then(res => {
this.dictDataList = res.data
console.log(this.dictDataList)
this.assetId = data.id
console.log(this.assetId)
getChildrenList(data).then(res => {
this.childrenList = res.data
resolve(this.childrenList)
this.childrenList.forEach(children => {
this.showTable.assetStructure = data
this.showTable.tableName = children.name
addTableData(this.showTable).then(res => {
// console.log(res)
})
})
})
}
// this.showAssets = data.type;
@ -102,6 +108,22 @@ export default {
showAssetsFun(data) {
this.title = data.name + '(' + data.databaseName + '-' + data.systemName + ')'
this.showAssets = data.type;
if (data.type === 'dataSource') {
this.assetId = data.id
console.log(this.assetId)
getTableDataCount(data.id).then(res => {
this.count = res.data
})
getChildrenList(data).then(res => {
this.childrenList = res.data
this.childrenList.forEach(children => {
this.showTable.assetStructure = data
this.showTable.tableName = children.name
addTableData(this.showTable).then(res => {
})
})
})
}
if (data.type === "dataTable") {
this.childrenParams = data
selectTableData(data.id).then(res => {