Browse Source

ModelMain 主界面改造

master
修宁 7 months ago
parent
commit
136a716136
  1. 2
      src/designer/Model2DEditor.vue
  2. 10
      src/designer/viewWidgets/IWidgets.js
  3. 11
      src/designer/viewWidgets/alarm/AlarmView.vue
  4. 10
      src/designer/viewWidgets/logger/LoggerView.vue
  5. 4
      src/designer/viewWidgets/modeltree/ModeltreeViewJs.js
  6. 11
      src/designer/viewWidgets/monitor/MonitorView.vue
  7. 10
      src/designer/viewWidgets/property/PropertyView.vue
  8. 10
      src/designer/viewWidgets/script/ScriptView.vue
  9. 10
      src/designer/viewWidgets/task/TaskView.vue
  10. 30
      src/designer/viewWidgets/toolbox/ToolboxView.vue
  11. 6
      src/views/ModelMain.vue

2
src/designer/ModelEditor.vue → src/designer/Model2DEditor.vue

@ -39,7 +39,7 @@
import { renderIcon } from '@/utils/webutils.ts' import { renderIcon } from '@/utils/webutils.ts'
export default { export default {
name: 'ModelEditor', name: 'Model2DEditor',
components: { components: {
renderIcon renderIcon
}, },

10
src/designer/viewWidgets/IWidgets.js

@ -0,0 +1,10 @@
import { renderIcon } from '@/utils/webutils.js'
export default {
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
}
}

11
src/designer/viewWidgets/alarm/AlarmView.vue

@ -6,7 +6,7 @@
<component :is="renderIcon('element Search')"></component> <component :is="renderIcon('element Search')"></component>
</template> </template>
</el-input> </el-input>
<span class="close" @click="closeMe('hideReft')"> <span class="close" @click="closeMe">
<component :is="renderIcon('element Close')" /> <component :is="renderIcon('element Close')" />
</span> </span>
</div> </div>
@ -55,21 +55,16 @@
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '../IWidgets.js'
export default { export default {
name: 'AlarmView', name: 'AlarmView',
emits: ['close'], emits: ['close'],
mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
},
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
} }
} }
</script> </script>

10
src/designer/viewWidgets/logger/LoggerView.vue

@ -54,21 +54,15 @@
</div> </div>
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '../IWidgets.js'
export default { export default {
name: 'LoggerView', name: 'LoggerView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
},
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
} }
} }
</script> </script>

4
src/designer/viewWidgets/modeltree/ModeltreeViewJs.js

@ -1,8 +1,9 @@
import { renderIcon } from '@/utils/webutils.js' import { renderIcon } from '@/utils/webutils.js'
import IWidgets from '../IWidgets.js'
export default { export default {
name: 'ModeltreeView', name: 'ModeltreeView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
currentLevel: '', currentLevel: '',
@ -11,7 +12,6 @@ export default {
} }
}, },
methods: { methods: {
renderIcon,
allowDrop(event) { allowDrop(event) {
return true return true
}, },

11
src/designer/viewWidgets/monitor/MonitorView.vue

@ -54,21 +54,16 @@
</div> </div>
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '../IWidgets.js'
export default { export default {
name: 'MonitorView', name: 'MonitorView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
}, },
methods: { methods: {}
renderIcon,
closeMe(name) {
this.$emit('close', name)
}
}
} }
</script> </script>

10
src/designer/viewWidgets/property/PropertyView.vue

@ -55,21 +55,15 @@
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '../IWidgets.js'
export default { export default {
name: 'PropertyView', name: 'PropertyView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
},
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
} }
} }
</script> </script>

10
src/designer/viewWidgets/script/ScriptView.vue

@ -15,21 +15,15 @@
</div> </div>
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '@/designer/viewWidgets/IWidgets.js'
export default { export default {
name: 'ScriptView', name: 'ScriptView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
},
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
} }
} }
</script> </script>

10
src/designer/viewWidgets/task/TaskView.vue

@ -34,21 +34,15 @@
</div> </div>
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js' import IWidgets from '../IWidgets.js'
export default { export default {
name: 'TaskView', name: 'TaskView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '' searchKeyword: ''
} }
},
methods: {
renderIcon,
closeMe() {
this.$emit('close')
}
} }
} }
</script> </script>

30
src/designer/viewWidgets/toolbox/ToolboxView.vue

@ -6,7 +6,7 @@
<component :is="renderIcon('element Search')"></component> <component :is="renderIcon('element Search')"></component>
</template> </template>
</el-input> </el-input>
<span class="close" @click="closeMe('hideLeft')"> <span class="close" @click="closeMe">
<component :is="renderIcon('element Close')" /> <component :is="renderIcon('element Close')" />
</span> </span>
</div> </div>
@ -32,11 +32,12 @@
</div> </div>
</template> </template>
<script> <script>
import { renderIcon } from '@/utils/webutils.js'
import IWidgets from '../IWidgets.js'
export default { export default {
name: 'ToolboxView', name: 'ToolboxView',
emits: ['close'], mixins: [IWidgets],
data() { data() {
return { return {
searchKeyword: '', searchKeyword: '',
@ -113,7 +114,6 @@ export default {
} }
}, },
methods: { methods: {
renderIcon,
closeMe() { closeMe() {
this.$emit('close') this.$emit('close')
}, },
@ -124,16 +124,16 @@ export default {
console.log(key, keyPath) console.log(key, keyPath)
}, },
updateFilteredItemsAndExpand() { updateFilteredItemsAndExpand() {
const expandedKeys = []; const expandedKeys = []
this.itemTypes.forEach(itemType => { this.itemTypes.forEach(itemType => {
const filteredChildren = itemType.children.filter(item => const filteredChildren = itemType.children.filter(item =>
item.label.includes(this.searchKeyword) || item.name.includes(this.searchKeyword)); item.label.includes(this.searchKeyword) || item.name.includes(this.searchKeyword))
if (filteredChildren.length > 0) { if (filteredChildren.length > 0) {
expandedKeys.push(itemType.name); expandedKeys.push(itemType.name)
} }
itemType.children = filteredChildren; itemType.children = filteredChildren
}); })
this.defaultExpandedKeys = expandedKeys; this.defaultExpandedKeys = expandedKeys
} }
}, },
watch: { watch: {
@ -141,17 +141,17 @@ export default {
if (!newVal) { if (!newVal) {
// //
this.itemTypes.forEach(itemType => { this.itemTypes.forEach(itemType => {
itemType.children = this.originalItemTypes.find(originalItemType => originalItemType.name === itemType.name).children; itemType.children = this.originalItemTypes.find(originalItemType => originalItemType.name === itemType.name).children
}); })
this.defaultExpandedKeys = []; this.defaultExpandedKeys = []
} else { } else {
this.updateFilteredItemsAndExpand(); this.updateFilteredItemsAndExpand()
} }
} }
}, },
mounted() { mounted() {
// itemTypes // itemTypes
this.originalItemTypes = JSON.parse(JSON.stringify(this.itemTypes)); this.originalItemTypes = JSON.parse(JSON.stringify(this.itemTypes))
} }
} }
</script> </script>

6
src/views/ModelMain.vue

@ -52,7 +52,7 @@
<SplitArea class="section-center" :class="{'hidden-split':hideRight}" :size="calcCenterSize"> <SplitArea class="section-center" :class="{'hidden-split':hideRight}" :size="calcCenterSize">
<el-tabs type="card" class="section-tabs" v-model="centerActiveName" @tab-click="handleCenterTabClick"> <el-tabs type="card" class="section-tabs" v-model="centerActiveName" @tab-click="handleCenterTabClick">
<el-tab-pane label="2D视图" name="ModelEditor" lazy> <el-tab-pane label="2D视图" name="ModelEditor" lazy>
<ModelEditor /> <Model2DEditor />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="3D视图" name="ModelView" lazy> <el-tab-pane label="3D视图" name="ModelView" lazy>
<ModelView /> <ModelView />
@ -107,13 +107,13 @@ import './ModelMain.less'
import { ModelMainInit, ModelMainMounted, ModelMainUnmounted } from '@/views/ModelMainInit.js' import { ModelMainInit, ModelMainMounted, ModelMainUnmounted } from '@/views/ModelMainInit.js'
import { getRootMenu } from '@/runtime/DefineMenu.js' import { getRootMenu } from '@/runtime/DefineMenu.js'
import { getWidgetByName, getWidgetBySide, getAllWidget } from '@/runtime/DefineWidget.js' import { getWidgetByName, getWidgetBySide, getAllWidget } from '@/runtime/DefineWidget.js'
import ModelEditor from '@/designer/ModelEditor.vue' import Model2DEditor from '@/designer/Model2DEditor.vue'
import ModelView from '@/designer/ModelView.vue' import ModelView from '@/designer/ModelView.vue'
import { normalizeShortKey } from '@/utils/webutils.ts' import { normalizeShortKey } from '@/utils/webutils.ts'
export default { export default {
components: { ModelEditor, ModelView, Split, SplitArea }, components: { Model2DEditor, ModelView, Split, SplitArea },
created() { created() {
ModelMainInit() ModelMainInit()
}, },

Loading…
Cancel
Save