Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 8414b8d8 by 史敦盼
Options

组织机构管理页面,以及其他问题修复

1 parent 1946ff44
Inline Side-by-side
Showing with 690 additions and 11 deletions
src/api/index.js
......@@ -542,6 +542,9 @@ export function archiAssetShowTree(params) {
export function archiIntelligenceSearchTree(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-view/assetTree', params)
}
export function archiIntelligenceSearchTreeNew(params) {
return post(EADC_ARRCHITECTURE + '/arc-ast-sys/assetInfoLevel', params)
}
// 总体架构资产智能搜索，架构版本
export function archiIntelligenceSearchVersionList(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-view/assetV', params)
......@@ -810,7 +813,22 @@ export function getQryByTree(params) {
export function getPreArc(params) {
return post(EADC_ARRCHITECTURE + '/arc-ast-info/qyLastEle', params)
}
// 获取组织树形
export function getOrgTreeData(params) {
return post(EADC_SHARED_ABILITY + '/org/tree', params)
}
// 单个删除组织
export function delOrgTreeItem(params) {
return post(EADC_SHARED_ABILITY + `/org/del`, params)
}
// 批量删除组织
export function batchDeleteOrgTreeItem(params) {
return post(EADC_SHARED_ABILITY + `/org/bDel`, params)
}
// 新增/编辑组织
export function editOrgTreeItem(params) {
return post(EADC_SHARED_ABILITY + `/org/cOrg`, params)
}
export function postRequest(url, params) {
return post(EADC_ARRCHITECTURE + url, params)
}
......
src/api/interface.js
import { EADC_ARRCHITECTURE, EADC_KNOWLEDGE_POOL } from '@/config/micromodule'
import { EADC_ARRCHITECTURE, EADC_KNOWLEDGE_POOL, EADC_SHARED_ABILITY } from '@/config/micromodule'
// 列表接口url
// 批量计划管理分页查询
export const batchPlanManagement = EADC_ARRCHITECTURE + '/bat-plan-info/'
......@@ -42,3 +42,6 @@ export const queryArchitectureFollowExamine =
export const queryqKLPerson = EADC_KNOWLEDGE_POOL + '/kl-talent-pool/qKLPerson/'
export const queryExpert = EADC_KNOWLEDGE_POOL + '/kl-talent-pool/'
// 系统管理-组织机构管理
export const queryOrganizationManagement = EADC_SHARED_ABILITY + '/org/'
src/components/Form.vue
......@@ -4,7 +4,7 @@
* @Autor: pan
* @Date: 2024-03-12 14:55:59
* @LastEditors: pan
* @LastEditTime: 2024-04-02 09:56:29
* @LastEditTime: 2024-04-16 17:46:16
-->
<template>
<div class="form-box">
......@@ -165,7 +165,7 @@ export default {
// el-input宽度
/deep/ .form-item {
.el-input,
.el-select {
.el-select, .el-cascader {
width: 100% !important;
}
.el-rate {
......
src/components/ListPage.vue
......@@ -4,7 +4,7 @@
* @Autor: pan
* @Date: 2024-03-12 14:01:57
* @LastEditors: pan
* @LastEditTime: 2024-04-01 11:52:46
* @LastEditTime: 2024-04-16 18:59:44
-->
<template>
<div class="list-page">
......@@ -25,7 +25,21 @@
<slot name="operationWrap" />
</div>
<!-- 表格 -->
<div class="table-wrap">
<div class="hasLeftTree" v-if="hasLeftTree">
<div class="leftTree">
<div class="treeTitle">{{ treeTitle }}</div>
<el-tree
:highlight-current="true"
:data="treeData"
:props="treeProps"
@node-click="handleNodeClick"
></el-tree>
</div>
<div class="table-wrap">
<slot name="tableWrap" />
</div>
</div>
<div class="table-wrap" v-else>
<slot name="tableWrap" />
</div>
</div>
......@@ -34,9 +48,38 @@
<script>
export default {
name: 'list-page',
props: {
hasLeftTree: {
type: Boolean,
default: false,
},
treeTitle: {
type: String,
default: '',
},
treeData: {
type: Array,
default: () => [],
},
treeProps: {
type: Object,
default: () => {
return {
children: 'children',
label: 'label',
}
},
},
},
methods: {
handleNodeClick(data) {
this.$emit('node-click', data)
},
},
}
</script>
<style scoped lang="scss">
// active #c0ebe4 color: 999
.list-page {
display: flex;
flex-direction: column;
......@@ -48,6 +91,52 @@ export default {
padding: 14px 0;
box-sizing: border-box;
}
.hasLeftTree {
display: flex;
flex: 1;
min-height: 0;
margin-left: -20px;
.leftTree {
width: 273px;
display: flex;
flex-direction: column;
// height: 100%;
.treeTitle {
height: 60px;
line-height: 60px;
padding: 0 15px;
box-sizing: border-box;
border-bottom: 1px solid #ebeef5;
text-align: left;
font-weight: bold;
}
/deep/ .el-tree {
flex: 1;
min-height: 0;
overflow: auto;
padding-right: 10px;
margin-bottom: 10px;
.el-tree-node__expand-icon.el-icon-caret-right.is-leaf {
background-color: #ffffff !important;
}
.el-tree-node__content:hover {
.is-leaf {
background-color: #f5f7fa !important;
}
}
}
/deep/ .el-tree--highlight-current
.el-tree-node.is-current
> .el-tree-node__content {
background-color: #c0ebe4 !important;
color: #999999;
.is-leaf {
background-color: #c0ebe4 !important;
}
}
}
}
.table-wrap {
flex: 1;
min-height: 180px;
......
src/components/SearchFormItem.vue
......@@ -4,7 +4,7 @@
* @Autor: pan
* @Date: 2024-03-12 15:11:47
* @LastEditors: pan
* @LastEditTime: 2024-04-02 12:39:00
* @LastEditTime: 2024-04-16 17:45:46
-->
<template>
<div class="form-item">
......@@ -105,7 +105,6 @@
v-model="currentVal"
v-bind="bindProps"
v-on="bindEvents"
size="mini"
clearable
></el-cascader>
</div>
......
src/router/index.js
......@@ -542,6 +542,15 @@ export const routes = [
title: '字典管理',
},
},
{
path: '/main/organizationManagement', // 系统管理 - 组织机构管理
name: 'organizationManagement',
component: () => import('@/views/organizationManagement/index.vue'),
meta: {
title: '组织机构管理',
keepAlive: true
},
},
],
},
]
......
src/utils/emptyView.js 0 → 100644
export default `\n <mxGraphModel dx=\"1273\" dy=\"573\" grid=\"1\" gridSize=\"10\" guides=\"1\" tooltips=\"1\" connect=\"1\" arrows=\"1\" fold=\"1\" page=\"1\" pageScale=\"1\" pageWidth=\"827\" pageHeight=\"1169\" math=\"0\" shadow=\"0\">\n <root>\n <mxCell id=\"0\"/>\n <mxCell id=\"1\" parent=\"0\"/>\n </root>\n </mxGraphModel>\n `
\ No newline at end of file
src/utils/index.js
......@@ -61,3 +61,18 @@ export function svgToBase64(svgCode) {
const utf8Bytes = new TextEncoder().encode(svgCode);
return 'data:image/svg+xml;base64,' + btoa(String.fromCharCode.apply(null, utf8Bytes));
}
export function deepClone(source) {
if (!source && typeof source !== 'object') {
throw new Error('error arguments', 'deepClone')
}
const targetObj = source.constructor === Array ? [] : {}
Object.keys(source).forEach(keys => {
if (source[keys] && typeof source[keys] === 'object') {
targetObj[keys] = deepClone(source[keys])
} else {
targetObj[keys] = source[keys]
}
})
return targetObj
}
\ No newline at end of file
src/views/Main/menu.js
......@@ -372,12 +372,16 @@ export const menuOptions = [
width: '220',
children: [
{
name: '字典管理',
name: '系统配置',
children: [
{
name: ' 字典管理 ',
name: '字典管理 ',
path: '/main/dictionaryManagement',
},
{
name: '组织机构管理 ',
path: '/main/organizationManagement',
},
],
},
],
......
src/views/archi-view-manage/canvas/index.vue
......@@ -75,7 +75,7 @@
queryViewManageQingDan
} from '@/api/index.js';
import $ from 'jquery';
import emptyView from '@/utils/emptyView'
export default {
name: 'Canvas',
components: {
......@@ -153,6 +153,9 @@
}
if(e.data.type == 'saveFileSignalXml') {
if(emptyView == e.data.data.mxGraphModel) {
return this.$message.warning('视图为空')
}
MessageBox.confirm('确定保存文件?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
......
src/views/meta-model-list/canvas/index.vue
......@@ -53,6 +53,7 @@
save_drawio_version,
save_drawio_attribute,
} from '@/api/index.js';
import emptyView from '@/utils/emptyView'
export default {
name: 'Canvas',
components: {
......@@ -126,6 +127,10 @@
}
if(e.data.type == 'saveFileSignalXml') {
if(emptyView == e.data.data.mxGraphModel) {
return this.$message.warning('视图为空')
}
// console.log(emptyView == e.data.data.mxGraphModel)
MessageBox.confirm('确定保存文件?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
......
src/views/organizationManagement/Add.vue 0 → 100644
<template>
<div>
<el-dialog
:title="title"
:visible.sync="showDialog"
:close-on-click-modal="false"
width="60%"
@close="handleClose()"
@open="handleOpen()"
>
<div>
<Form ref="addForm" :form-options="formOptions" label-width="120px">
</Form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" no-backslash @click="handleSave()"
>保 存</el-button
>
</span></el-dialog
>
</div>
</template>
<script>
import Form from '@/components/Form.vue'
import { editOrgTreeItem } from '@/api'
import { deepClone } from '@/utils'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
orgTreeData: {
type: Array,
default: () => [],
},
},
data() {
return {}
},
components: {
Form,
},
computed: {
handleOrgTreeData() {
let arr = deepClone(this.orgTreeData)
arr.unshift({
orgName: '无',
orgId: '0',
})
return arr
},
formOptions() {
return [
{
label: '组织名称', // label文字
prop: 'orgName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请填写组织名称', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
maxlength: 30,
showWordLimit: true,
span: 12,
},
{
label: '组织编号', // label文字
prop: 'orgNum', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请填写组织编码', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
maxlength: 30,
showWordLimit: true,
span: 12,
},
{
label: '上级组织', // label文字
prop: 'parentOrgId', // 字段名
element: 'el-cascader', // 指定elementui组件
placeholder: '请选择', // elementui组件属性
options: this.handleOrgTreeData,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
span: 12,
props: {
children: 'children',
label: 'orgName',
value: 'orgId',
},
filterable: true,
events: {
change(data) {
console.log(data)
}
}
},
{
label: '组织简称', // label文字
prop: 'orgSimpleName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请填写组织简称', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
maxlength: 30,
showWordLimit: true,
span: 12,
},
{
label: '启用状态', // label文字
prop: 'orgStatus', // 字段名
element: 'el-select', // 指定elementui组件
initValue: undefined, // 字段初始值
placeholder: '请选择', // elementui组件属性
dictType: 'org_status',
span: 12,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
},
{
label: '组织类型', // label文字
prop: 'orgType', // 字段名
element: 'el-select', // 指定elementui组件
initValue: undefined, // 字段初始值
placeholder: '请选择', // elementui组件属性
dictType: 'org_type',
span: 12,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
},
{
label: '组织机构描述', // label文字
prop: 'orgDesc', // 字段名
type: 'textarea',
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
span: 24,
maxlength: 30,
showWordLimit: true,
rows: 4,
},
{
label: '排列顺序', // label文字
prop: 'orgSort', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请填写排列顺序(默认1)', // elementui组件属性
maxlength: 30,
span: 24,
},
]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
},
created() {},
methods: {
handleAddParams() {
const formInfo = this.$refs['addForm'].getData()
const params = {
...this.rowData,
...formInfo,
parentOrgId: formInfo.parentOrgId[formInfo.parentOrgId.length - 1]
}
return params
},
handleSave() {
this.$refs['addForm'].onValidate(() => {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
editOrgTreeItem(this.handleAddParams()).then((res) => {
loading.close()
if (res.code === 200) {
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
} else {
this.$message.error(res.msg)
}
})
})
},
handleClose() {
this.showDialog = false
this.formOptions.forEach((v) => {
if(v.prop === 'parentOrgId') {
v.initValue = []
} else {
v.initValue = ''
}
})
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
handleOpen() {
if (Object.keys(this.rowData).length) {
this.formOptions.forEach((v) => {
if(v.prop === 'parentOrgId') {
let ids = this.rowData.ids.split(",");
ids.pop();
ids.shift();
let isdArr = [];
if (ids.length > 0) {
for (let i = 0; i < ids.length; i++) {
let item = ids[i];
if (ids.length != 0) {
isdArr.push(Number(item));
}
}
}
v.initValue = isdArr ? isdArr : [1];
if(!v.initValue.includes(this.rowData.orgId)) {
v.initValue.push(this.rowData.orgId)
}
console.log(v.initValue)
} else {
v.initValue = this.rowData[v.prop]
}
})
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
})
} else {
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
})
}
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/elementui.scss';
</style>
src/views/organizationManagement/index.vue 0 → 100644
<!--
* @Description: 组织机构管理
* @Version: 2.0
* @Autor: pan
* @Date: 2024-04-16 15:09:52
* @LastEditors: pan
* @LastEditTime: 2024-04-16 19:33:58
-->
<template>
<div class="searchTable">
<list-page
:hasLeftTree="true"
treeTitle="组织机构"
:treeProps="treeProps"
:treeData="orgTreeData"
@node-click="treeItemClick"
>
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 中部操作按钮 -->
<template #operationWrap>
<el-button
type="primary"
icon="el-icon-document-add"
size="medium"
plain
@click="fnTopOperation('新增')"
>新增</el-button
>
<el-button
type="primary"
icon="el-icon-edit"
size="medium"
plain
@click="fnTopOperation('编辑')"
>编辑</el-button
>
<el-button
type="danger"
icon="el-icon-delete"
size="medium"
plain
@click="fnTopOperation('删除')"
>删除</el-button
>
</template>
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
@selection-change="selectionChange"
:query="query"
:columns="columns"
id-key="orgId"
>
</table-config>
</template>
</list-page>
<Add
@querySearch="handleUpdate"
:visible.sync="visible"
:row-data="rowData"
:title="dialogTitle"
:orgTreeData="orgTreeData"
></Add>
</div>
</template>
<script>
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import Add from './Add.vue'
import { queryOrganizationManagement } from '@/api/interface'
import { getDictTypeOptions } from '@/utils'
import {
getOrgTreeData,
delOrgTreeItem,
batchDeleteOrgTreeItem,
} from '@/api/index'
export default {
name: 'organizationManagement',
components: {
ListPage,
SearchForm,
TableConfig,
Add,
},
data() {
return {
selectRows: [],
query: {
url: queryOrganizationManagement,
method: 'post',
queryParam: {},
},
orgStatusOptions: [],
orgTreeData: [],
treeProps: {
children: 'children',
label: 'orgName',
value: 'orgId',
},
visible: false,
rowData: {},
dialogTitle: '',
}
},
computed: {
formOptions() {
return [
{
label: '组织名称', // label文字
prop: 'orgName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入', // elementui组件属性
},
]
},
columns() {
return [
{ type: 'selection', width: '55px' },
{ label: '序号', type: 'index', width: '80px' },
{
label: '组织名称',
prop: 'orgName',
},
{ label: '组织简称', prop: 'orgSimpleName' },
{
label: '启用状态',
prop: 'orgStatus',
options: this.orgStatusOptions,
collectionType: true,
width: '120px',
},
{ label: '创建人', width: '120px', prop: 'createMan' },
{
label: '操作',
type: 'operation',
width: '200px',
actionButtons: [
{
title: '编辑',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-edit',
},
{
title: '删除',
type: 'danger',
size: 'mini',
plain: true,
icon: 'el-icon-delete',
},
],
callback: (row, title) => {
this.fnOperation(row, title)
},
},
]
},
},
created() {
this.getDicts()
this.getOrgTreeData()
},
methods: {
handleUpdate() {
this.querySearch()
this.getOrgTreeData()
},
treeItemClick(data) {
console.log('data', data)
if(!data.children) {
this.query.queryParam.parentOrgId = data.orgId
this.querySearch()
}
},
fnTopOperation(type) {
switch (type) {
case '新增':
this.dialogTitle = '新增组织'
this.rowData = {}
this.visible = true
break
case '编辑':
if (this.selectRows.length != 1) {
return this.$message.warning('选择一项进行编辑')
}
this.rowData = this.selectRow[0]
this.dialogTitle = '编辑组织'
this.visible = true
break
case '删除':
if (this.selectRows.length == 0) {
return this.$message.warning('请选择需要删除项')
}
this.fnDel()
break
default:
break
}
},
getDicts() {
getDictTypeOptions('org_status').then((res) => {
this.orgStatusOptions = res
})
},
getOrgTreeData() {
getOrgTreeData({}).then((res) => {
if (res.code === 200) {
this.orgTreeData = res.data
}
})
},
// 表格勾选的数据
selectionChange(data) {
this.selectRows = data
},
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
fnOperation(row, title) {
switch (title) {
case '编辑':
this.fnEdit(row)
break
case '删除':
this.fnDel(row)
break
default:
break
}
},
fnEdit(row) {
this.rowData = row
this.dialogTitle = '编辑组织'
this.visible = true
},
fnDel(row) {
this.$confirm('是否确认删除?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
let [params, delApi] = [{}, null]
if(row) {
params = {
orgId: row.orgId,
}
delApi = delOrgTreeItem
} else {
params = this.selectRows.map(v => Number(v.orgId))
delApi = batchDeleteOrgTreeItem
}
delApi(params).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error('删除失败')
}
})
})
.catch(() => {})
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/common.scss';
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!