Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 7cdcc5a1 by 史敦盼
Options

资产关系页面, 全局配置文件

1 parent f08b0f44
Expand all
Inline Side-by-side
Showing with 1700 additions and 82 deletions
public/index.html
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" /> <meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" /> <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title> <title></title>
<link type="text/css" rel="stylesheet" href="./jsmind/jsmind.css" /> <link type="text/css" rel="stylesheet" href="./jsmind/jsmind.css" />
<script type="text/javascript" src="./jsmind/jsmind.js"></script> <script type="text/javascript" src="./jsmind/jsmind.js"></script>
<script <script
...@@ -14,7 +14,8 @@ ...@@ -14,7 +14,8 @@
></script> ></script>
<script type="text/javascript" src="./jsmind/dom-to-image.js"></script> <script type="text/javascript" src="./jsmind/dom-to-image.js"></script>
<script type="text/javascript" src="./jsmind/jsmind.screenshot.js"></script> <script type="text/javascript" src="./jsmind/jsmind.screenshot.js"></script>
<script type="text/javascript" src="./mxClient.min.js"></script> <script type="text/javascript" src="./drawio/mxgraph/mxClient.js"></script>
<script src="./js/system.config.js"></script>
<!-- <script type="text/javascript" src="./echarts.min.js"></script> --> <!-- <script type="text/javascript" src="./echarts.min.js"></script> -->
</head> </head>
<body> <body>
...@@ -30,6 +31,9 @@ ...@@ -30,6 +31,9 @@
<!-- <script type="text/javascript" src="http://192.168.0.189:9999/web-apps/apps/api/documents/api.js"></script> --> <!-- <script type="text/javascript" src="http://192.168.0.189:9999/web-apps/apps/api/documents/api.js"></script> -->
<!-- built files will be auto injected --> <!-- built files will be auto injected -->
</body> </body>
<script>
document.title = SystemConfig.SYS_NAME
</script>
<style> <style>
html, html,
body { body {
......
public/js/system.config.js 0 → 100644
/**
* 系统配置文件
*/
const SystemConfig = {
// 系统名称
SYS_NAME: '数字化架构设计与管控支撑工具',
// 默认分页每页显示数量
DEFAULT_PAGE_SIZE: 30,
// 默认主题颜色
DEFAULT_PRIMARY: '#0d867f',
// onlyoffice 文档url
DOCUMENT_SERVER_URL: 'http://192.168.0.102/',
DOCUMENT_SERVER_URL2: 'http://192.168.0.120:18050/',
// baseurl
BASE_URL: '', // 'http://192.168.0.102:80',
// 请求超时时间
NETWORK_TIMEOUT: 300000
}
public/mxClient.min.js deleted 100644 → 0
This diff could not be displayed because it is too large.
public/resources/editor.txt deleted 100644 → 0
askZoom=Enter zoom (%)
properties=Properties
outline=Outline
tasks=Tasks
help=Help
public/resources/editor_de.txt deleted 100644 → 0
askZoom=Zoom eingeben (%)
properties=Eigenschaften
outline=Uebersicht
tasks=Aufgaben
help=Hilfe
public/resources/editor_zh.txt deleted 100644 → 0
askZoom=进入缩放(%25)
properties=属性
outline=轮廓
tasks=任务
help=帮助
\ No newline at end of file
public/resources/graph.txt deleted 100644 → 0
alreadyConnected=Nodes already connected
containsValidationErrors=Contains validation errors
updatingDocument=Updating Document. Please wait...
updatingSelection=Updating Selection. Please wait...
collapse-expand=Collapse/Expand
doubleClickOrientation=Doubleclick to change orientation
close=Close
error=Error
done=Done
cancel=Cancel
ok=OK
public/resources/graph_de.txt deleted 100644 → 0
alreadyConnected=Knoten schon verbunden
containsValidationErrors=Enthält Validierungsfehler
updatingDocument=Aktualisiere Dokument. Bitte warten...
updatingSelection=Aktualisiere Markierung. Bitte warten...
collapse-expand=Einklappen/Ausklappen
doubleClickOrientation=Doppelklicken um Orientierung zu ändern
close=Schliessen
error=Fehler
done=Fertig
cancel=Abbrechen
ok=OK
public/resources/graph_zh.txt deleted 100644 → 0
alreadyConnected=节点已经连接
containsValidationErrors=包含效验错误
updatingDocument=更新文档。请等候......
updatingSelection=更新所选项。请等候......
collapse-expand=折叠/展开
doubleClickOrientation=双击以改变方向
close=关闭
error=错误
done=完成
cancel=取消
ok=确定
\ No newline at end of file
src/api/dataMapping.js
...@@ -9,4 +9,45 @@ import { ...@@ -9,4 +9,45 @@ import {
// 查询所属资产关系 // 查询所属资产关系
export function queryEleRela(params) { export function queryEleRela(params) {
return post(EADC_ARRCHITECTURE + '/ele-rel/qEleRela', params) return post(EADC_ARRCHITECTURE + '/ele-rel/qEleRela', params)
}
// 资产关系分类新增
export function createEleRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/cEleRelation', params)
}
// 修改资产关系分类
export function updEleRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/uEleRelation', params)
}
// 发布/停用资产关系分类
export function pEleRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/pEleRelation', params)
}
// 资产关系分类查询
export function queryEleRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/qEleRelation', params)
}
// 资产关系分类删除
export function removeEleRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/rEleRelation', params)
}
// 资产关系新增
export function createAssetRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/cAssetRelation', params)
}
// 资产关系修改
export function updAssetRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/uAssetRelation', params)
}
// 根据元素查资产
export function queryAssetByEle(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/queryAssetByEle', params)
}
// 资产关系删除
export function removeAssetRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/rAssetRelation', params)
}
// 资产关系发布/停用
export function pAssetRelation(params) {
return post(EADC_ARRCHITECTURE + '/archi-asset-relation/pAssetRelation', params)
} }
\ No newline at end of file
src/api/interface.js
...@@ -45,3 +45,9 @@ export const queryExpert = EADC_KNOWLEDGE_POOL + '/kl-talent-pool/' ...@@ -45,3 +45,9 @@ export const queryExpert = EADC_KNOWLEDGE_POOL + '/kl-talent-pool/'
// 系统管理-组织机构管理 // 系统管理-组织机构管理
export const queryOrganizationManagement = EADC_SHARED_ABILITY + '/org/' export const queryOrganizationManagement = EADC_SHARED_ABILITY + '/org/'
// 资产关系分类查询
export const queryEleRelation = EADC_ARRCHITECTURE + '/archi-asset-relation/qEleRelation'
// 资产关系查询
export const queryAssetRelation = EADC_ARRCHITECTURE + '/archi-asset-relation/qAssetRelation'
src/components/Functional.vue 0 → 100644
<script>
export default {
functional: true,
props: {
row: {
type: Object,
required: true,
},
item: {
type: Object,
required: true,
},
},
render(h, ctx) {
return ctx.props.item.render(h, ctx.props.row, ctx.props.item)
},
};
</script>
\ No newline at end of file
src/components/SearchFormItem.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-12 15:11:47 * @Date: 2024-03-12 15:11:47
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-04-22 14:53:56 * @LastEditTime: 2024-05-11 15:31:54
--> -->
<template> <template>
<div class="form-item"> <div class="form-item">
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
v-model="currentVal" v-model="currentVal"
v-bind="bindProps" v-bind="bindProps"
v-on="bindEvents" v-on="bindEvents"
:controls-position="itemOptions['controls-position'] || 'right'" :controls-position="itemOptions['controls-position']"
></el-input-number> ></el-input-number>
<el-select <el-select
v-if="isSelect" v-if="isSelect"
......
src/components/TableConfig.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-03-11 14:53:40 * @Date: 2024-03-11 14:53:40
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-04-02 09:14:13 * @LastEditTime: 2024-05-11 16:09:31
--> -->
<!-- 示例 <!-- 示例
columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => { columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => {
...@@ -86,8 +86,11 @@ ...@@ -86,8 +86,11 @@
? items.disabledCallback(scope.row, items.title) ? items.disabledCallback(scope.row, items.title)
: false : false
" "
@click="item.callback(scope.row, items.title)" @click="item.callback(scope.row, items.title ? items.title : 'titleChange')"
><span v-if="!items.circle">{{ items.title }}</span></el-button >
<span v-if="items.titleChange">{{items.titleChange(scope.row, items)}}</span>
<span v-else-if="!items.circle">{{ items.title }}</span>
</el-button
> >
</template> </template>
</el-table-column> </el-table-column>
...@@ -103,6 +106,10 @@ ...@@ -103,6 +106,10 @@
<template v-if="item.__slotName" #default="scope"> <template v-if="item.__slotName" #default="scope">
<slot :name="item.__slotName" :data="scope"></slot> <slot :name="item.__slotName" :data="scope"></slot>
</template> </template>
<!-- 渲染函数 -->
<template v-else-if="item.render" #default="scope">
<Functional :item="item" :row="scope.row" />
</template>
<!-- 字典值匹配 如后端给state: 0 页面要渲染成已停用--> <!-- 字典值匹配 如后端给state: 0 页面要渲染成已停用-->
<template v-else-if="item.collectionType" #default="scope"> <template v-else-if="item.collectionType" #default="scope">
<span <span
...@@ -134,6 +141,7 @@ ...@@ -134,6 +141,7 @@
</template> </template>
<script> <script>
import Functional from './Functional'
import { get, post } from '@/utils/http' import { get, post } from '@/utils/http'
export default { export default {
name: 'tableConfig', name: 'tableConfig',
...@@ -198,6 +206,9 @@ export default { ...@@ -198,6 +206,9 @@ export default {
}, },
}, },
}, },
components: {
Functional
},
data() { data() {
return { return {
tableData: [], tableData: [],
......
src/utils/dictionary.js
...@@ -129,3 +129,9 @@ export const archiAssetTypeOptions = [ ...@@ -129,3 +129,9 @@ export const archiAssetTypeOptions = [
{ label: '完善', value: 2 }, { label: '完善', value: 2 },
{ label: '新增', value: 3 }, { label: '新增', value: 3 },
] ]
// 控件
export const controlType = [
{ label: '单行文本框', value: '0' },
{ label: '多行文本框', value: '1' },
{ label: '下拉框', value: '2' },
]
\ No newline at end of file
src/utils/http.js
...@@ -5,8 +5,8 @@ import router from '../router/index.js'; ...@@ -5,8 +5,8 @@ import router from '../router/index.js';
import { Message, MessageBox, Loading } from 'element-ui'; import { Message, MessageBox, Loading } from 'element-ui';
import { SM4Util } from "./sm4"; import { SM4Util } from "./sm4";
axios.defaults.timeout = 300000; axios.defaults.timeout = SystemConfig.NETWORK_TIMEOUT// 300000;
axios.defaults.baseURL = process.env.VUE_APP_BASE_URL; axios.defaults.baseURL = SystemConfig.BASE_URL// process.env.VUE_APP_BASE_URL;
function encryptStringBySM4_CBC(str) {//使用sm4-cbc算法给字符串加密 function encryptStringBySM4_CBC(str) {//使用sm4-cbc算法给字符串加密
......
src/views/busi-assets-list/AddDicAttr.vue 0 → 100644
<!--
* @Description: 编辑字典属性
* @Version: 2.0
* @Autor: pan
* @Date: 2024-05-11 11:07:01
* @LastEditors: pan
* @LastEditTime: 2024-05-11 15:34:15
-->
<template>
<el-dialog
:title="title"
:visible.sync="showDialog"
:close-on-click-modal="false"
width="60%"
@close="handleClose()"
@open="handleOpen()"
>
<div>
<Form labelWidth="120px" 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" :loading="loading" v-preventReClick @click="handleSave()"
>确 定</el-button
>
</span></el-dialog
>
</template>
<script>
import Form from '@/components/Form.vue'
import { controlType } from '@/utils/dictionary'
import { getYMXZDGLProyUpdate, getYMXZDGLProyAdd } from '@/api'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
id: {
type: [String, Number],
}
},
data() {
return {
loading: false
}
},
components: {
Form,
},
computed: {
formOptions() {
return [
{
label: '字段名', // label文字
prop: 'fieldName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
{
label: '中文名', // label文字
prop: 'cnName', // 字段名
element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请输入内容', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
{
label: '排序', // label文字
prop: 'displayOrder', // 字段名
element: 'el-input-number', // 指定elementui组件
initValue: '', // 字段初始值
min: 0,
},
{
label: '长度', // label文字
prop: 'contentLength', // 字段名
element: 'el-input-number', // 指定elementui组件
initValue: '', // 字段初始值
min: 0,
},
{
label: '是否可以展示', // label文字
prop: 'notNull', // 字段名
element: 'el-radio', // 指定elementui组件
initValue: '', // 字段初始值
options: [
{ label: '是', value: 0 },
{
label: '否',
value: 1,
},
],
},
{
label: '是否展示', // label文字
prop: 'isShow', // 字段名
element: 'el-radio', // 指定elementui组件
initValue: '', // 字段初始值
options: [
{
label: '显示',
value: 0
},
{
label: '不显示',
value: 1
}
],
},
{
label: '控件', // label文字
prop: 'controlType', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
options: controlType,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
},
]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
isEdit() {
if(this.title === '编辑字典属性') {
return true
} else {
return false
}
}
},
created() {},
methods: {
handleClose() {
this.showDialog = false
this.formOptions.forEach((v) => {
v.initValue = ''
})
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
handleSave() {
this.$refs['addForm'].onValidate(() => {
this.loading = true
const formInfo = this.$refs['addForm'].getData()
const params = {
type: 4,
typeId: this.id,
...formInfo,
}
const typeApi = this.isEdit ? getYMXZDGLProyUpdate : getYMXZDGLProyAdd
typeApi(params).then(res => {
this.loading = false
if (res.code == 200) {
this.$message.success('保存成功')
this.showDialog = false
this.$emit('refreshTable')
}
}).catch(err => {
this.loading = false
})
})
},
handleOpen() {
if (Object.keys(this.rowData).length) {
this.formOptions.forEach((v) => {
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"></style>
src/views/busi-assets-list/RelationChildAdd.vue 0 → 100644
<!--
* @Description: 新建资产关系 弹窗
* @Version: 2.0
* @Autor: pan
* @Date: 2024-05-10 18:41:29
* @LastEditors: pan
* @LastEditTime: 2024-05-11 18:24:00
-->
<template>
<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="140px">
<template #icon="{ data, formData }">
<el-radio
v-model="formData.iconId"
v-for="(item, idx) in data.options"
:key="idx"
:label="item.value"
:disabled="isView"
@change="handleIconChange"
>
<img width="20" :src="item.url" alt="" />
</el-radio>
</template>
</Form>
<el-form labelPosition="right" label-width="120px">
<el-col :span="24">
<el-form-item
v-for="(item, index) in dynamicForm_"
:key="index"
:label="item.cnName + ':'"
>
<template v-if="item.controlType == 0">
<el-input
placeholder="请输入内容"
v-no-backslash
v-model="item.value_"
maxlength="100"
></el-input>
</template>
<template v-else-if="item.controlType == 1">
<el-input
placeholder="请输入内容"
v-no-backslash
v-model="item.value_"
type="textarea"
:rows="3"
maxlength="200"
show-word-limit
></el-input>
</template>
<template v-else>
<el-select class="w-100" v-model="item.value_" clearable>
<el-option
v-for="item2 in item.dictArray_"
:key="item2.id"
:label="item2.label"
:value="item2.id"
></el-option>
</el-select>
</template>
</el-form-item>
</el-col>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()">取 消</el-button>
<el-button
type="primary"
@click="handleSubmit"
v-if="this.title != '详情'"
>提 交</el-button
>
</span></el-dialog
>
</template>
<script>
import Form from '@/components/Form.vue'
import { getYMXZDGLProyList } from '@/api'
import {
queryAssetByEle,
createAssetRelation,
updAssetRelation,
} from '@/api/dataMapping'
import { relationIcons } from '@/config'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
relationData: {
type: Object,
default: () => {},
},
},
data() {
return {
// 资产属性
dynamicForm_: [],
assetByEleOptions: [],
targetAssetByEleOptions: [],
}
},
components: {
Form,
},
computed: {
formOptions() {
const that = this
return [
{
label: '源资产名称', // label文字
prop: 'assetId', // 字段名
element: 'el-select', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
options: this.assetByEleOptions,
filterable: true,
keyOption: {
label: 'assetName',
value: 'assetId',
},
events: {
change(e) {
that.sourseEleIdChange(e, 'assetByEleOptions', 'assetNumber')
},
},
},
{
label: '源资产编号', // label文字
prop: 'assetNumber', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
readonly: true,
},
{
label: '所属资产关系分类', // label文字
prop: 'rsName', // 字段名
element: 'el-input', // 指定elementui组件
initValue: this.relationData.rsName, // 字段初始值
readonly: true,
},
{
label: '目标资产名称', // label文字
prop: 'relaAssetId', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
options: this.targetAssetByEleOptions,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
keyOption: {
label: 'assetName',
value: 'assetId',
},
events: {
change(e) {
that.sourseEleIdChange(
e,
'targetAssetByEleOptions',
'targetAssetNumber',
)
},
},
},
{
label: '目标资产编号', // label文字
prop: 'targetAssetNumber', // 字段名
element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值
readonly: true,
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
{
label: '图标设置', // label文字
prop: 'iconId', // 字段名
element: 'el-radio', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
span: 24,
__slotName: 'icon',
options: relationIcons,
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
isEdit() {
if (this.title === '修改资产关系') {
return true
} else {
return false
}
},
isView() {
if (this.title === '查看资产关系') {
return true
}
return false
},
},
mounted() {
// console.log('attr', this.relationData)
},
methods: {
sourseEleIdChange(v, options, name) {
const currentItem = this[options].find((item) => item.assetId == v) || {}
this.$refs['addForm'].changeFormItemData(
name,
currentItem.assetNumber || '',
)
},
handleIconChange() {
this.$refs['addForm'].$refs['formRef'].clearValidate('iconId')
},
handleSubmit() {
this.$refs['addForm'].onValidate(() => {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
const formInfo = this.$refs['addForm'].getData()
const typeApi = this.isEdit ? updAssetRelation : createAssetRelation
const params = {
...this.rowData,
...formInfo,
state: 2,
assetRelaId: this.relationData.assetRelaId
}
typeApi(params).then((res) => {
if (res.code === 200) {
loading.close()
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
}
})
})
},
handleClose() {
this.showDialog = false
this.formOptions.forEach((v) => {
if (v.prop !== 'eleRelaId') {
v.initValue = ''
}
})
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
handleOpen() {
this.getDicyTable()
this.queryAssetByEle('assetByEleOptions', 'eleId')
this.queryAssetByEle('targetAssetByEleOptions', 'relaEleId')
if (Object.keys(this.rowData).length) {
this.formOptions.forEach((v) => {
v.initValue = this.rowData[v.prop]
})
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
})
} else {
this.$nextTick(() => {
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
})
}
},
getDicyTable() {
//字典表格
const params = {
type: 4,
typeId: this.relationData.assetRelaId,
}
getYMXZDGLProyList(params).then((res) => {
if (res.code == 200) {
this.dynamicForm_ = res.data.map((item) => {
return {
id: item.propertyId,
cnName: item.cnName,
value_: item.value_,
controlType: item.controlType,
dictKey: item.dictKey ? item.dictKey : null,
}
})
}
})
},
queryAssetByEle(options, id) {
const params = {
elementId: this.relationData[id],
}
queryAssetByEle(params).then((res) => {
if (res.code === 200) {
this[options] = res.data
}
})
},
},
}
</script>
<style scoped lang="scss">
@import '@/styles/elementui.scss';
</style>
src/views/busi-assets-list/RelationChildPage.vue 0 → 100644
<!--
* @Description: 具体资产关系页面
* @Version: 2.0
* @Autor: pan
* @Date: 2024-05-10 17:20:35
* @LastEditors: pan
* @LastEditTime: 2024-05-11 18:46:17
-->
<template>
<div class="searchTable">
<list-page style="padding: 0">
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 中部操作按钮 -->
<template #operationWrap>
<el-button
icon="el-icon-document-add"
type="primary"
size="medium"
plain
@click="fnAdd()"
>新建</el-button
>
</template>
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
@selection-change="selectionChange"
:query="query"
:columns="columns"
>
</table-config>
</template>
</list-page>
<!-- 新建资产关系 -->
<RelationChildAdd
:row-data="rowData"
:title="dialogTitle"
v-bind="$attrs"
:visible.sync="visible"
@querySearch="querySearch"
/>
</div>
</template>
<script>
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import RelationChildAdd from './RelationChildAdd.vue'
import { queryAssetRelation } from '@/api/interface'
import { removeAssetRelation, pAssetRelation } from '@/api/dataMapping'
import { relationIcons } from '@/config'
import { getDictTypeOptions } from '@/utils'
export default {
name: 'relationPage',
data() {
return {
query: {
url: queryAssetRelation,
method: 'post',
queryParam: {},
},
selectRows: {},
rowData: {},
dialogTitle: '',
visible: false,
stateOptions: [],
}
},
components: {
ListPage,
SearchForm,
TableConfig,
RelationChildAdd,
},
computed: {
formOptions() {
let arr = [
{
label: '源资产名称', // label文字
prop: 'needName', // 字段名
element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请输入内容', // elementui组件属性
},
{
label: '目标资产名称', // label文字
prop: 'targetAssetName', // 字段名
element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请输入内容', // elementui组件属性
},
{
label: '所属元素关系', // label文字
prop: 'aaa', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请选择', // elementui组件属性
},
{
label: '状态', // label文字
prop: 'status', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请选择', // elementui组件属性
},
]
return arr
},
columns() {
let arr = [
{ type: 'selection', width: '55px' },
{ label: '序号', type: 'index', width: '80px' },
{ label: '源资产编号', prop: 'assetCode', width: '120px' },
{ label: '源资产名称', prop: 'assetName', width: '120px' },
{ label: '目标资产编号', prop: 'relaAssetCode', width: '120px' },
{ label: '目标资产名称', prop: 'relaAssetName', width: '120px' },
{ label: '所属元素关系', prop: 'rsName', width: '120px' },
{
label: '图标',
prop: 'iconId',
render: (h, params) => {
return h('img', {
attrs: {
src: this.getIconUrl(params.iconId),
width: 30,
height: 30,
},
})
},
},
{
label: '状态',
prop: 'state',
options: this.stateOptions,
collectionType: true,
},
{ label: '创建时间', width: '120px', prop: 'createTime' },
{
label: '操作',
type: 'operation',
width: '440px',
actionButtons: [
{
title: '查看',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-view',
},
{
title: '编辑',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-edit',
},
{
title: '',
type: 'primary',
size: 'mini',
plain: true,
icon: '',
titleChange: (row, btnProp) => {
this.$set(btnProp, 'icon', 'el-icon-edit')
// btnProp.icon = 'el-icon-edit' el-icon-upload2
if(row.state == 2 || row.state == 0) {
btnProp.icon = 'el-icon-upload2'
return '发布'
} else {
btnProp.icon = 'el-icon-remove-outline'
return'停用'
}
// return row.state == 2 || row.state == 0 ? '发布' : '停用'
},
},
{
title: '删除',
type: 'danger',
size: 'mini',
plain: true,
icon: 'el-icon-delete',
},
],
callback: (row, title) => {
this.fnOperation(row, title)
},
},
]
return arr
},
},
created() {
this.getDicts()
},
methods: {
getDicts() {
getDictTypeOptions('asset_status').then((res) => {
this.stateOptions = res
})
},
getIconUrl(id) {
const item = relationIcons.find((v) => v.value === id) || {}
return item.url
},
fnAdd() {
this.dialogTitle = '新建资产关系'
this.rowData = {}
this.visible = true
},
// 表格勾选的数据
selectionChange(data) {
this.selectRows = data
},
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
/**
* @description: 操作按钮
* @param {Object} row 当前操作行数据
* @param {String} title 当前操作按钮名称
* @author: pan
*/
fnOperation(row, title) {
switch (title) {
case '查看':
this.fnEdit(row, '查看')
break
case '编辑':
this.fnEdit(row, '修改')
break
case 'titleChange':
this.fnEnable(row)
break;
case '删除':
this.fnOp(row, '删除')
break
default:
break
}
},
fnEdit(row, text) {
this.rowData = row
this.visible = true
this.dialogTitle = `${text}资产关系`
},
fnEnable(row) {
const title = row.state == 2 || row.state == 0 ? '发布' : '停用'
this.$confirm(`是否确认${title}?`, '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
relaId: row.relaId,
state: title === '发布' ? 1 : 0
}
pAssetRelation(params).then((res) => {
if (res.code === 200) {
this.$message.success(`${title}成功`)
this.$refs.searchTable.queryData()
} else {
this.$message.error(`${title}失败`)
}
})
})
.catch(() => {})
},
fnOp(row, title) {
this.$confirm(`是否确认${title}?`, '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
ids: [row.relaId]
}
removeAssetRelation(params).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error('删除失败')
}
})
})
.catch(() => {})
},
},
}
</script>
<style scoped lang="scss">
.search-form-box {
margin-top: 20px;
margin-bottom: -10px;
}
/deep/ .list-page {
.formWrap {
border-bottom: none;
}
.el-form-item__label {
width: auto !important;
}
}
</style>
src/views/busi-assets-list/RelationClassAdd.vue 0 → 100644
<!--
* @Description: 新建/编辑资产关系分类 弹窗
* @Version: 2.0
* @Autor: pan
* @Date: 2024-05-10 18:41:29
* @LastEditors: pan
* @LastEditTime: 2024-05-11 17:43:02
-->
<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">
<template #icon="{ data, formData }">
<el-radio
v-model="formData.iconId"
v-for="(item, idx) in data.options"
:key="idx"
:label="item.value"
:disabled="isView"
@change="handleIconChange"
>
<img width="20" :src="item.url" alt="" />
</el-radio>
</template>
</Form>
<template v-if="title != '新建资产关系分类'">
<div class="flex-e-c m-b-10" v-if="!isView">
<el-button type="primary" size="mini" @click="openDicyDialog"
>新增</el-button
>
</div>
<div style="height: 300px">
<PropTable :columns="tableColumn" :table-data="tableData" />
</div>
</template>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" v-preventReClick @click="handleSubmit"
>确 定</el-button
>
</span></el-dialog
>
<!-- 编辑字典属性 -->
<AddDicAttr
:title="dicAttrTitle"
:id="rowData.assetRelaId"
:visible.sync="dicAttrVisible"
@refreshTable="getDicyTable"
/>
</div>
</template>
<script>
import Form from '@/components/Form.vue'
import PropTable from '@/components/PropTable'
import AddDicAttr from './AddDicAttr.vue'
import { queryEleRela, createEleRelation, updEleRelation } from '@/api/dataMapping'
import { getEleList, getYMXZDGLProyDel, getYMXZDGLProyList } from '@/api'
import { relationIcons } from '@/config'
import { whether, controlType } from '@/utils/dictionary'
export default {
props: {
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
rowData: {
type: Object,
default: () => {},
},
},
data() {
return {
relaOptions: [],
eleList: [],
dicAttrVisible: false,
tableData: [],
dicAttrTitle: '',
}
},
components: {
Form,
PropTable,
AddDicAttr,
},
computed: {
formOptions() {
return [
{
label: '资产关系名称', // label文字
prop: 'rsName', // 字段名
element: 'el-input', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
disabled: this.isView,
},
{
label: '源资产元素', // label文字
prop: 'eleId', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
keyOption: {
label: 'elementName',
value: 'elementId',
},
options: this.eleList,
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
disabled: this.isView,
filterable: true
},
{
label: '目标资产元素', // label文字
prop: 'relaEleId', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
options: this.eleList,
keyOption: {
label: 'elementName',
value: 'elementId',
},
rules: [{ required: true, trigger: 'change', message: '不能为空' }],
disabled: this.isView,
filterable: true
},
{
label: '是否跨架构', // label文字
prop: 'across', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
options: whether,
disabled: this.isView,
},
{
label: '遵从元素关系', // label文字
prop: 'eleRelaId', // 字段名
element: 'el-select', // 指定elementui组件
initValue: '', // 字段初始值
options: this.relaOptions,
keyOption: {
label: 'rsName',
value: 'eleRelaId',
},
filterable: true,
disabled: this.isView,
},
{
label: '图标设置', // label文字
prop: 'iconId', // 字段名
element: 'el-radio', // 指定elementui组件
placeholder: '请输入内容', // elementui组件属性
span: 24,
__slotName: 'icon',
options: relationIcons,
rules: [{ required: true, trigger: 'blur', message: '不能为空' }],
},
]
},
tableColumn() {
let arr = [
{ label: '序号', type: 'index', width: '80px' },
{ label: '字段名', prop: 'fieldName' },
{ label: '中文名', prop: 'cnName' },
{ label: '排序', prop: 'displayOrder' },
{ label: '长度', prop: 'contentLength' },
{
label: '控件',
prop: 'controlType',
options: controlType,
collectionType: true,
},
]
if (this.isEdit) {
arr = [
...arr,
{
label: '操作',
type: 'operation',
width: '180px',
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, rowIndex) => {
this.fnOperation(row, title, rowIndex)
},
},
]
}
return arr
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
isEdit() {
if (this.title === '修改资产关系分类') {
return true
} else {
return false
}
},
isView() {
if (this.title === '查看资产关系分类') {
return true
}
return false
},
},
created() {},
methods: {
handleIconChange() {
this.$refs['addForm'].$refs['formRef'].clearValidate('iconId')
},
fnOperation(row, title, rowIndex) {
if (title === '编辑') {
this.dicAttrVisible = true
// this.dicAttrRowData = row
this.dicAttrTitle = '编辑字典属性'
} else {
this.deleteDicy(row)
}
},
openDicyDialog() {
this.dicAttrVisible = true
// this.dicAttrRowData = {}
this.dicAttrTitle = '新增字典属性'
},
deleteDicy(row) {
this.$confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
propertyId: row.propertyId,
}
getYMXZDGLProyDel(params).then((res) => {
if (res.code == 200) {
this.getDicyTable()
this.$message.success('删除成功!')
} else {
this.$message.warning(res.msg)
}
})
})
.catch(() => {})
},
getDicyTable() {
//字典表格
const params = {
type: 4,
typeId: this.rowData.assetRelaId,
}
getYMXZDGLProyList(params).then((res) => {
if (res.code == 200) {
this.tableData = res.data
}
})
},
getEleRelaOptions() {
queryEleRela().then((res) => {
if (res.code === 200) {
this.relaOptions = res.data
} else {
this.relaOptions = []
}
})
},
handleSubmit() {
this.$refs['addForm'].onValidate(() => {
const loading = this.$loading({
lock: true,
text: '保存中',
spinner: 'el-icon-loading',
})
const formInfo = this.$refs['addForm'].getData()
const typeApi = this.isEdit ? updEleRelation : createEleRelation
const params = {
state: 2,
...this.rowData,
...formInfo,
}
typeApi(params)
.then((res) => {
loading.close()
if (res.code === 200) {
this.$message.success('保存成功')
this.showDialog = false
this.handleClose()
this.$emit('querySearch')
} else {
this.$message.warning(res.msg)
}
})
.catch((err) => {
loading.close()
})
})
},
handleClose() {
this.showDialog = false
this.tableData = []
this.formOptions.forEach((v) => {
v.initValue = ''
})
this.$refs['addForm'].addInitValue()
this.$refs['addForm'].onReset()
},
getEleList() {
getEleList().then((res) => {
if (res.code == 200) {
this.eleList = res.data
}
})
},
handleOpen() {
this.getEleRelaOptions()
this.getEleList()
if (Object.keys(this.rowData).length) {
this.getDicyTable()
this.formOptions.forEach((v) => {
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"></style>
src/views/busi-assets-list/RelationPage.vue 0 → 100644
<!--
* @Description: 资产关系分类页面
* @Version: 2.0
* @Autor: pan
* @Date: 2024-05-10 17:20:35
* @LastEditors: pan
* @LastEditTime: 2024-05-11 16:11:33
-->
<template>
<div class="searchTable">
<list-page style="padding: 0">
<!-- 查询表单插槽 -->
<template #formWrap>
<SearchForm @onSearch="querySearch" :form-options="formOptions" />
</template>
<!-- 中部操作按钮 -->
<template #operationWrap>
<el-button
icon="el-icon-document-add"
type="primary"
size="medium"
plain
@click="fnAdd()"
>新建</el-button
>
</template>
<!-- 表格插槽 -->
<template #tableWrap>
<table-config
ref="searchTable"
@selection-change="selectionChange"
:query="query"
:columns="columns"
@fetchData="fetchData"
>
</table-config>
</template>
</list-page>
<!-- 新建/修改资产关系分类 -->
<RelationClassAdd
:title="dialogTitle"
:rowData="rowData"
:visible.sync="visible"
@querySearch="querySearch"
/>
</div>
</template>
<script>
import ListPage from '@/components/ListPage.vue'
import SearchForm from '@/components/SearchForm.vue'
import TableConfig from '@/components/TableConfig.vue'
import RelationClassAdd from './RelationClassAdd.vue'
import { queryEleRelation } from '@/api/interface'
import { removeEleRelation, pEleRelation } from '@/api/dataMapping'
import { relationIcons } from '@/config'
import { getDictTypeOptions } from '@/utils'
export default {
name: 'relationPage',
data() {
return {
query: {
url: queryEleRelation,
method: 'post',
queryParam: {},
},
selectRows: {},
rowData: {},
dialogTitle: '',
visible: false,
acrossOptions: [],
}
},
components: {
ListPage,
SearchForm,
TableConfig,
RelationClassAdd,
},
computed: {
formOptions() {
let arr = [
{
label: '资产关系名称', // label文字
prop: 'rsName', // 字段名
element: 'el-input', // 指定elementui组件
initValue: '', // 字段初始值
placeholder: '请输入内容', // elementui组件属性
},
]
return arr
},
columns() {
let arr = [
{ type: 'selection', width: '55px' },
{ label: '序号', type: 'index', width: '80px' },
{
label: '资产关系名称',
prop: 'rsName',
render: (h, params) => {
return h(
'span',
{
style: {
color: SystemConfig.DEFAULT_PRIMARY,
cursor: 'pointer',
borderBottom: '1px solid #0b8680',
},
on: {
click: () => {
this.$emit('linkTo', params)
}
}
},
params.rsName,
)
},
},
{ label: '源资产元素', prop: 'eleName' },
{
label: '目标资产元素',
prop: 'relaEleName',
},
{
label: '是否跨架构',
prop: 'across',
options: this.acrossOptions,
collectionType: true,
},
{
label: '遵从元素关系',
width: '200px',
prop: 'eleRelaName',
},
{
label: '图标',
prop: 'iconId',
render: (h, params) => {
return h('img', {
attrs: {
src: this.getIconUrl(params.iconId),
width: 30,
height: 30
},
})
},
},
{ label: '创建时间', width: '120px', prop: 'createTime' },
{
label: '操作',
type: 'operation',
width: '270px',
actionButtons: [
{
title: '查看',
type: 'primary',
size: 'mini',
plain: true,
icon: 'el-icon-view',
},
{
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)
},
},
]
return arr
},
},
created() {
this.getDicts()
},
methods: {
fetchData(data) {
this.$emit('relationData', data.records)
},
getDicts() {
getDictTypeOptions('is_across').then((res) => {
this.acrossOptions = res
})
},
getIconUrl(id) {
const item = relationIcons.find((v) => v.value === id) || {}
return item.url
},
fnAdd() {
this.dialogTitle = '新建资产关系分类'
this.rowData = {}
this.visible = true
},
// 表格勾选的数据
selectionChange(data) {
this.selectRows = data
},
querySearch(data) {
this.query.queryParam = {
...this.query.queryParam,
...data,
}
this.$refs.searchTable.queryData()
},
/**
* @description: 操作按钮
* @param {Object} row 当前操作行数据
* @param {String} title 当前操作按钮名称
* @author: pan
*/
fnOperation(row, title) {
switch (title) {
case '查看':
this.fnEdit(row, '查看')
break
case '编辑':
this.fnEdit(row, '修改')
break
case '删除':
this.fnDel(row)
break
default:
break
}
},
fnEdit(row, text) {
this.rowData = row
this.visible = true
this.dialogTitle = `${text}资产关系分类`
},
fnDel(row) {
this.$confirm('是否确认删除?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const params = {
ids: [row.assetRelaId]
}
removeEleRelation(params).then((res) => {
if (res.code === 200) {
this.$message.success('删除成功')
this.$refs.searchTable.queryData()
} else {
this.$message.error('删除失败')
}
})
})
.catch(() => {})
},
},
}
</script>
<style scoped lang="scss">
.search-form-box {
margin-top: 20px;
margin-bottom: -10px;
}
/deep/ .list-page {
.formWrap {
border-bottom: none;
}
.el-form-item__label {
width: auto !important;
}
}
</style>
src/views/busi-assets-list/index.vue
...@@ -7,6 +7,7 @@ ...@@ -7,6 +7,7 @@
:highlight-current="true" :highlight-current="true"
:props="{ children: 'subList', label: 'viewName', id: 'viewId' }" :props="{ children: 'subList', label: 'viewName', id: 'viewId' }"
default-expand-all default-expand-all
:expand-on-click-node="false"
node-key="viewId" node-key="viewId"
:default-expanded-keys="treeDefaultExpand" :default-expanded-keys="treeDefaultExpand"
:current-node-key="currentNodekey" :current-node-key="currentNodekey"
...@@ -15,7 +16,15 @@ ...@@ -15,7 +16,15 @@
> >
</el-tree> </el-tree>
</div> </div>
<div class="right_container"> <div class="right_container" v-if="isRelation">
<!-- 资产关系分类页面 -->
<RelationPage @relationData="changeRelationData" @linkTo="linkTo" />
</div>
<div class="right_container" v-else-if="isRelationChild">
<!-- 资产关系分类页面 -->
<RelationChildPage :relation-data="relationData" />
</div>
<div class="right_container" v-else>
<div class="search_menu"> <div class="search_menu">
<div class="search_menu_item_container"> <div class="search_menu_item_container">
<div class="search_menu_item"> <div class="search_menu_item">
...@@ -296,7 +305,7 @@ ...@@ -296,7 +305,7 @@
> >
</el-pagination> </el-pagination>
</div> </div>
<el-dialog <el-dialog
:title=" :title="
is_add_edit == 'add' is_add_edit == 'add'
...@@ -579,6 +588,8 @@ ...@@ -579,6 +588,8 @@
<script> <script>
import ChooseSvg from './ChooseSvg.vue' import ChooseSvg from './ChooseSvg.vue'
import RelationPage from './RelationPage'
import RelationChildPage from './RelationChildPage'
import { import {
getArchiViewManage, getArchiViewManage,
getZiChanJiaGouTable, getZiChanJiaGouTable,
...@@ -595,6 +606,7 @@ import { ...@@ -595,6 +606,7 @@ import {
getPreArc, getPreArc,
getAssetCode getAssetCode
} from '@/api/index.js' } from '@/api/index.js'
import { queryEleRelation } from '@/api/dataMapping'
import $ from 'jquery' import $ from 'jquery'
import { MessageBox, Message } from 'element-ui' import { MessageBox, Message } from 'element-ui'
import { getDictTypeOptions } from '@/utils' import { getDictTypeOptions } from '@/utils'
...@@ -603,6 +615,8 @@ export default { ...@@ -603,6 +615,8 @@ export default {
name: 'busiAssetslist', name: 'busiAssetslist',
components: { components: {
ChooseSvg, ChooseSvg,
RelationPage,
RelationChildPage
}, },
watch: {}, watch: {},
data() { data() {
...@@ -663,6 +677,11 @@ export default { ...@@ -663,6 +677,11 @@ export default {
viewName: '总体架构资产', viewName: '总体架构资产',
subList: [], subList: [],
}, },
{
viewId: 99,
viewName: '总体架构资产关系',
subList: [],
},
], ],
tableHeight: null, tableHeight: null,
selectTable: [], selectTable: [],
...@@ -697,11 +716,26 @@ export default { ...@@ -697,11 +716,26 @@ export default {
predefineColors: archiEleColor, predefineColors: archiEleColor,
graphId: '', graphId: '',
selectedObject: {}, selectedObject: {},
assetNumberDis: false assetNumberDis: false,
isRelation: false,
isRelationChild: false,
relationData: {}
} }
}, },
created() { created() {
this.getDicts() this.getDicts()
queryEleRelation().then(res => {
if(res.code === 200) {
this.treeData[1].subList = res.data.records.map(v => {
return {
...v,
viewId: v.assetRelaId + '_1',
viewName: v.rsName,
}
})
}
})
}, },
mounted() { mounted() {
this.getTreeData() this.getTreeData()
...@@ -711,6 +745,20 @@ export default { ...@@ -711,6 +745,20 @@ export default {
this.set_table_height() this.set_table_height()
}, },
methods: { methods: {
linkTo(data) {console.log('---', data)
this.$refs.tree.setCurrentKey(data.assetRelaId + '_1')
this.isRelationChild = true
this.isRelation = false
},
changeRelationData(data) {
this.treeData[1].subList = data.map(v => {
return {
...v,
viewId: v.assetRelaId + '_1',
viewName: v.rsName,
}
})
},
formatParentElement(row, column, cellValue, index) { formatParentElement(row, column, cellValue, index) {
return cellValue?.replace(/\]|\[|\/?]/g, '').replace('null', '') return cellValue?.replace(/\]|\[|\/?]/g, '').replace('null', '')
}, },
...@@ -1630,14 +1678,26 @@ export default { ...@@ -1630,14 +1678,26 @@ export default {
const right_container_height = $('.right_container').height() const right_container_height = $('.right_container').height()
this.tableHeight = right_container_height - 260 + 'px' this.tableHeight = right_container_height - 260 + 'px'
}, },
treeClick(data) { treeClick(data, node, self) {
//左侧树点击 console.log(data, node, self)
if (!data.archiBelongId) return if(data.viewId === 99) {
this.archiBelongId = data.archiBelongId this.isRelation = true
this.archiType = data.archiType this.isRelationChild = false
this.getArchiEleList() // 所属元素下拉 } else if(data.viewId !==0 && !data.archiType) { console.log('child')
// this.archiAssetTypeId = data.viewId; this.isRelationChild = true
this.get_table() this.isRelation = false
this.relationData = data
} else {
this.isRelation = false
this.isRelationChild = false
//左侧树点击
if (!data.archiBelongId) return
this.archiBelongId = data.archiBelongId
this.archiType = data.archiType
this.getArchiEleList() // 所属元素下拉
// this.archiAssetTypeId = data.viewId;
this.get_table()
}
}, },
getTreeData() { getTreeData() {
//查询左侧树 //查询左侧树
......
src/views/dataMapping/index.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-04-23 11:30:05 * @Date: 2024-04-23 11:30:05
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-05-10 15:39:56 * @LastEditTime: 2024-05-11 14:06:16
--> -->
<template> <template>
<div class="dataMapping w-100"> <div class="dataMapping w-100">
...@@ -659,6 +659,7 @@ export default { ...@@ -659,6 +659,7 @@ export default {
) )
this.fnUpdateRelationGraph() this.fnUpdateRelationGraph()
} }
// console.log('rightdata', this.dataSubGraphData)
}, },
fnHandleToSubData() { fnHandleToSubData() {
const checkedNodeKeys = this.getCheckedKeys() const checkedNodeKeys = this.getCheckedKeys()
...@@ -740,18 +741,22 @@ export default { ...@@ -740,18 +741,22 @@ export default {
console.log('data', data) console.log('data', data)
console.log('node', node) console.log('node', node)
console.log('checkedNodes', this.$refs.tree.getCheckedNodes()) console.log('checkedNodes', this.$refs.tree.getCheckedNodes())
this.setNode(node) if(this.activeName === '3') {
console.log('this.tableData', this.tableData) this.handleDataSubGraph(data, node)
this.tableData = [...this.$refs.tree.getCheckedNodes(), ...this.addData]
console.log(
'this.tableData',
this.$refs.tree.getCheckedNodes(),
this.addData,
)
if (!this.tableData.length) {
this.$refs['graph'].clear()
} else { } else {
this.handleDataToGraph(data, node) this.setNode(node)
console.log('this.tableData', this.tableData)
this.tableData = [...this.$refs.tree.getCheckedNodes(), ...this.addData]
console.log(
'this.tableData',
this.$refs.tree.getCheckedNodes(),
this.addData,
)
if (!this.tableData.length) {
this.$refs['graph'].clear()
} else {
this.handleDataToGraph(data, node)
}
} }
}, },
setNode(node) { setNode(node) {
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!