|
|
@@ -3,14 +3,19 @@ meta:
|
|
|
enabled: false
|
|
|
</route>
|
|
|
|
|
|
-<script lang="ts" setup name="PagesExampleTable">
|
|
|
+<script lang="ts" setup name="modelObjectOAM">
|
|
|
import type { FormInstance } from 'element-plus'
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
import ObjectOAMComponent from './components/objectOAM.vue'
|
|
|
import useSettingsStore from '@/store/modules/settings'
|
|
|
import { getObjectById } from '@/api/model/modelObjectApi'
|
|
|
-import { deleteObjectOAMById, getObjectOAMById, getObjectOAMByList } from '@/api/model/modelObjectOAMApi'
|
|
|
-import { oamType } from '@/utils/tool'
|
|
|
+import {
|
|
|
+ deleteObjectOAMById,
|
|
|
+ getObjectOAMById,
|
|
|
+ getObjectOAMByList,
|
|
|
+ getObjectOAMListById,
|
|
|
+} from '@/api/model/modelObjectOAMApi'
|
|
|
+import {oamType, sqlType} from '@/utils/tool'
|
|
|
|
|
|
const settingsStore = useSettingsStore()
|
|
|
const route = useRoute()
|
|
|
@@ -24,6 +29,7 @@ interface TreeNode {
|
|
|
label: string
|
|
|
isLeaf: boolean
|
|
|
oamId: number
|
|
|
+ oamCode: string
|
|
|
children?: TreeNode[]
|
|
|
}
|
|
|
|
|
|
@@ -86,12 +92,14 @@ const getObjectOAMData = async () => {
|
|
|
}
|
|
|
|
|
|
const getOAMTree = async () => {
|
|
|
- const { data } = await getObjectOAMByList(state.search)
|
|
|
+ const { modelId, objectId } = state.search
|
|
|
+ const { data } = await getObjectOAMListById(modelId, objectId)
|
|
|
const children: TreeNode[] = []
|
|
|
data.forEach((item: any) => {
|
|
|
return children.push({
|
|
|
label: item.oamTitle,
|
|
|
oamId: item.oamId,
|
|
|
+ oamCode: item.oamCode,
|
|
|
isLeaf: true,
|
|
|
})
|
|
|
})
|
|
|
@@ -100,6 +108,7 @@ const getOAMTree = async () => {
|
|
|
label: '对象行为',
|
|
|
isLeaf: false,
|
|
|
oamId: -1,
|
|
|
+ oamCode: '',
|
|
|
children,
|
|
|
},
|
|
|
]
|
|
|
@@ -154,13 +163,15 @@ const onSuccess = () => {
|
|
|
getOAMTree()
|
|
|
}
|
|
|
|
|
|
+const activeName = ref('first')
|
|
|
+
|
|
|
// 返回列表页
|
|
|
function goBack() {
|
|
|
if (settingsStore.settings.tabbar.enable && settingsStore.settings.tabbar.mergeTabsBy !== 'activeMenu') {
|
|
|
- tabbar.close({ name: 'modelList' })
|
|
|
+ tabbar.close({ name: 'model_object_List' })
|
|
|
}
|
|
|
else {
|
|
|
- router.push({ name: 'modelList' })
|
|
|
+ router.push({ name: 'model_object_List' })
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -185,14 +196,14 @@ function goBack() {
|
|
|
<template #default="{ node, data }">
|
|
|
<div class="custom-tree-node">
|
|
|
<div class="label" :title="node.label">
|
|
|
- <el-icon v-if="data.isLeaf" size="16px" style="margin-right: 5px;">
|
|
|
- <svg-icon name="uim:box" />
|
|
|
- </el-icon>
|
|
|
<div class="text">
|
|
|
- {{ data.label }}
|
|
|
+ <el-icon v-if="data.isLeaf" size="16px" style="margin:0 5px 5px 0;">
|
|
|
+ <svg-icon name="ant-design:api-outlined" />
|
|
|
+ </el-icon>
|
|
|
+ <span>{{ data.label }}</span>
|
|
|
</div>
|
|
|
<div class="code">
|
|
|
- {{ oamType(data.oamType) }}
|
|
|
+ {{ data.oamCode }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -201,25 +212,73 @@ function goBack() {
|
|
|
</el-scrollbar>
|
|
|
</template>
|
|
|
|
|
|
- <div class="form">
|
|
|
- <tool-header>
|
|
|
- <template #right>
|
|
|
- <el-button type="primary" @click="onObjectOAMAdd">添加</el-button>
|
|
|
- <el-button type="primary" @click="onObjectOAMEdit">编辑</el-button>
|
|
|
- </template>
|
|
|
- </tool-header>
|
|
|
- <page-main title="SQL">
|
|
|
- <div class="question">
|
|
|
- <ol class="answer">
|
|
|
- <li><span>Sql</span><br>{{ state.oam.sqlStatement }}</li>
|
|
|
- <li><span>Select</span><br>{{ state.oam.sqlSelect }}</li>
|
|
|
- <li><span>From </span><br>{{ state.oam.sqlFrom }}</li>
|
|
|
- <li><span>Where</span><br>{{ state.oam.sqlWhere }}</li>
|
|
|
- <li><span>Order</span><br>{{ state.oam.sqlOrder }}</li>
|
|
|
- <li><span>说明</span><br>{{ state.oam.oamDesc }}</li>
|
|
|
- </ol>
|
|
|
- </div>
|
|
|
- </page-main>
|
|
|
+ <div class="container">
|
|
|
+ <el-tabs v-model="activeName" class="demo-tabs">
|
|
|
+ <el-tab-pane label="行为定义" name="first">
|
|
|
+ <el-descriptions
|
|
|
+ :title="state.oam.oamTitle"
|
|
|
+ direction="horizontal"
|
|
|
+ :column="1"
|
|
|
+ size="small"
|
|
|
+ border
|
|
|
+ >
|
|
|
+ <template #extra>
|
|
|
+ <el-button type="primary" @click="onObjectOAMEdit">编辑</el-button>
|
|
|
+ <el-button type="primary" @click="onObjectOAMDelete">删除</el-button>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ label-align="right"
|
|
|
+ label="编码"
|
|
|
+ width="150px"
|
|
|
+ >
|
|
|
+ {{ state.oam.oamCode }}
|
|
|
+ </el-descriptions-item>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ label="行为类型"
|
|
|
+ width="150px"
|
|
|
+ label-align="right"
|
|
|
+ >
|
|
|
+ {{ oamType(state.oam.oamType) }}
|
|
|
+ </el-descriptions-item>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ label-align="right"
|
|
|
+ width="150px"
|
|
|
+ label="操作类型"
|
|
|
+ >
|
|
|
+ {{ sqlType(state.oam.sqlType) }}
|
|
|
+ </el-descriptions-item>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ v-if="state.oam.sqlType === 1"
|
|
|
+ label-align="right"
|
|
|
+ width="150px"
|
|
|
+ label="Sql"
|
|
|
+ >
|
|
|
+ {{ state.oam.sqlStatement }}
|
|
|
+ </el-descriptions-item>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ v-if="state.oam.oamType === 3"
|
|
|
+ label-align="right"
|
|
|
+ width="150px"
|
|
|
+ label="Count"
|
|
|
+ >
|
|
|
+ {{ state.oam.sqlCount }}
|
|
|
+ </el-descriptions-item>
|
|
|
+
|
|
|
+ <el-descriptions-item
|
|
|
+ label-align="right"
|
|
|
+ width="150px"
|
|
|
+ label="说明"
|
|
|
+ >
|
|
|
+ {{ state.oam.oamDesc }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
</div>
|
|
|
</LayoutContainer>
|
|
|
</div>
|
|
|
@@ -229,10 +288,45 @@ function goBack() {
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.absolute-container {
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .page-header {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .page-main {
|
|
|
+ // 让 page-main 的高度自适应
|
|
|
+ flex: 1;
|
|
|
+ overflow: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .flex-container {
|
|
|
+ position: static;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.flex-container{
|
|
|
:deep(.left-side) {
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
height: 100%;
|
|
|
+ .search{
|
|
|
+ margin: 15px 0;
|
|
|
+ }
|
|
|
+ .btns {
|
|
|
+ display: inline-flex;
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ .add {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
.tree {
|
|
|
flex: 1;
|
|
|
@@ -240,7 +334,7 @@ function goBack() {
|
|
|
|
|
|
.el-tree {
|
|
|
.el-tree-node__content {
|
|
|
- height: 40px;
|
|
|
+ height: 60px;
|
|
|
}
|
|
|
|
|
|
.is-current > .el-tree-node__content {
|
|
|
@@ -257,33 +351,30 @@ function goBack() {
|
|
|
justify-content: center;
|
|
|
|
|
|
.label {
|
|
|
- display: inline-flex;
|
|
|
- align-items: center;
|
|
|
width: calc(100% - 10px);
|
|
|
color: var(--el-text-color-primary);
|
|
|
+ padding: 10px;
|
|
|
|
|
|
- .text {
|
|
|
- @include text-overflow;
|
|
|
+ @include text-overflow;
|
|
|
+
|
|
|
+ .el-icon {
|
|
|
+ padding-top: 5px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .code {
|
|
|
+ padding-left: 20px;
|
|
|
+ width: calc(100% - 10px);
|
|
|
+ color: var(--el-text-color-placeholder);
|
|
|
+
|
|
|
+ @include text-overflow;
|
|
|
+ }
|
|
|
+
|
|
|
&:hover {
|
|
|
.actions {
|
|
|
display: block;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
- .actions {
|
|
|
- display: none;
|
|
|
- position: absolute;
|
|
|
- right: 10px;
|
|
|
- top: 50%;
|
|
|
- transform: translateY(-50%);
|
|
|
-
|
|
|
- .el-button {
|
|
|
- padding: 5px 8px;
|
|
|
- }
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
}
|
houyaf