sx/map
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

物模型基本功能实现

Browse Source
This commit is contained in:
高云鹏 2024-07-03 21:23:20 +08:00
parent 562ec7eb3d
commit c65d28ae29
6 changed files with 1223 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

774
ui/dasadmin/src/views/backend/DeviceModel/DeviceModel.vue Normal file
View File

@ -0,0 +1,774 @@
<template>
<div class="DeviceModel">
<el-dialog v-model="modelDialogVisible" :title="modelDialogTitle" :width="400" @close="cancelModelForm">
<el-form ref="modelFormRef" :model="modelForm" :rules="modelFormRules" label-width="110">
<el-form-item prop="iotModelName" :label="ModelFieldsEnums['iotModelName']">
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.iotModelName"></el-input>
</el-form-item>
<el-form-item prop="iotModelCode" :label="ModelFieldsEnums['iotModelCode']">
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.iotModelCode"></el-input>
</el-form-item>
<el-form-item prop="objectType" :label="ModelFieldsEnums['objectType']">
<el-input :disabled="modelDialogState === ModelDialogTitleStateType['detail']" v-model="modelForm.objectType"></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button :disabled="modelDialogState === ModelDialogTitleStateType['detail']" type="primary" @click="submitModelForm"
>提交</el-button
>
<el-button @click="cancelModelForm">取消</el-button>
</template>
</el-dialog>
<el-container class="containerPart">
<el-aside class="asidePart">
<el-header class="asideHeader">
<el-input
v-model="searchModelValue"
:suffix-icon="Search"
clearable
@input="debounceSearchModel"
class="searchModelInput"
></el-input>
</el-header>
<el-main class="asideMain">
<el-tree
:data="treeData"
:props="DeviceModelPropReplace"
class="modelTree"
@node-contextmenu="modelContextMenu"
@node-click="modelNodeClick"
highlight-current
>
</el-tree>
</el-main>
</el-aside>
<el-container class="mainContainer">
<el-header class="mainHeader">
<div class="mainHeaderCenter">
<el-input class="modelAttributeSearchInput"></el-input>
<el-radio-group v-model="modelAttributeSearchRadio">
<el-radio value="attributeName">名称</el-radio>
<el-radio value="attributeCode">编码</el-radio>
</el-radio-group>
<el-button :icon="Search" @input="searchModelAttribute">查询</el-button>
</div>
<div class="mainHeaderRight">
<el-button :icon="Plus" @click="addModelAttributeAndService">新增</el-button>
<el-button :icon="Upload" @click="upLoadModel">导入</el-button>
<el-button :icon="Download" @click="downLoadModel">导出</el-button>
</div>
</el-header>
<el-main class="mainMain">
<el-tabs v-model="ModelTabs" @tab-change="changeTabs" class="tabsPart">
<el-tab-pane :label="modelTabsType['attribute']" name="attribute">
<el-table :data="attributeTableData" class="tablePart">
<el-table-column
prop="attributeName"
:label="ModelAttributeFieldsEnums['attributeName']"
align="center"
></el-table-column>
<el-table-column
prop="attributeCode"
:label="ModelAttributeFieldsEnums['attributeCode']"
align="center"
></el-table-column>
<el-table-column
prop="attributeTypeName"
:label="ModelAttributeFieldsEnums['attributeTypeName']"
align="center"
></el-table-column>
<el-table-column prop="porder" :label="ModelAttributeFieldsEnums['porder']" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="80" align="center">
<template #default="scope">
<div class="tableOperate">
<a @click="editAttributeForm(scope.row)">编辑</a>
<a>|</a>
<el-popconfirm title="确定删除么？" @confirm="delAttributeForm(scope.row)">
<template #reference>
<a>删除</a>
</template>
</el-popconfirm>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane :label="modelTabsType['service']" name="service">
<el-table :data="serviceTableData" class="tablePart">
<el-table-column prop="serviceName" :label="ModelServiceFieldsEnums['serviceName']" align="center"></el-table-column>
<el-table-column prop="serviceCode" :label="ModelServiceFieldsEnums['serviceCode']" align="center"></el-table-column>
<el-table-column
prop="serviceTypeName"
:label="ModelServiceFieldsEnums['serviceTypeName']"
align="center"
></el-table-column>
<el-table-column prop="porder" :label="ModelServiceFieldsEnums['porder']" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="80" align="center">
<template #default="scope">
<div class="tableOperate">
<a @click="editServiceForm(scope.row)">编辑</a>
<a>|</a>
<el-popconfirm title="确定删除么？" @confirm="delServiceForm(scope.row)">
<template #reference>
<a>删除</a>
</template>
</el-popconfirm>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
<div class="mainFooter">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="currentPageSize"
:total="pageTotal"
:page-sizes="pagePagination"
background
:pager-count="7"
layout="prev, pager, next, jumper,sizes,total"
></el-pagination>
</div>
</el-main>
</el-container>
</el-container>
<ContextMenu :pos="contextMenuPos" :visible="modelOperateVisible" @update:visible="closeModelOperate">
<template #default>
<div class="modelOperate">
<el-button @click="openModel('detail', curContextMenuTreeData)" :icon="Reading">查看</el-button>
<el-button @click="openModel('add')" :icon="DocumentAdd">新增</el-button>
<el-button @click="openModel('edit', curContextMenuTreeData)" :icon="DocumentChecked">修改</el-button>
<el-popconfirm title="确认删除？" @confirm="delModel">
<template #reference>
<el-button :icon="DocumentDelete" @click.stop>删除</el-button>
</template>
</el-popconfirm>
</div>
</template>
</ContextMenu>
<el-dialog v-model="attributeVisible" :title="attributeFormTitle" @close="closeAttributeForm" :width="600">
<el-form ref="attributeFormRef" :model="attributeForm" label-width="100">
<el-form-item :label="ModelAttributeFieldsEnums['attributeName']" prop="attributeName">
<el-input v-model="attributeForm.attributeName"></el-input>
</el-form-item>
<el-form-item :label="ModelAttributeFieldsEnums['attributeCode']" prop="attributeCode">
<el-input v-model="attributeForm.attributeCode"></el-input>
</el-form-item>
<el-form-item :label="ModelAttributeFieldsEnums['attributeTypeName']" prop="attributeType">
<el-select v-model="attributeForm.attributeType">
<el-option label="模拟量" :value="138"></el-option>
<el-option label="累积量" :value="139"></el-option>
<el-option label="离散量" :value="140"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="ModelAttributeFieldsEnums['porder']" prop="porder">
<el-input v-model="attributeForm.porder"></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button type="primary" @click="submitAttributeForm">提交</el-button>
<el-button @click="closeAttributeForm">取消</el-button>
</template>
</el-dialog>
<el-dialog v-model="serviceVisible" :title="serviceFormTitle" @close="closeServiceForm" :width="600">
<el-form ref="serviceFormRef" :model="serviceForm" label-width="100">
<el-form-item :label="ModelServiceFieldsEnums['serviceName']" prop="serviceName">
<el-input v-model="serviceForm.serviceName"></el-input>
</el-form-item>
<el-form-item :label="ModelServiceFieldsEnums['serviceCode']" prop="serviceCode">
<el-input v-model="serviceForm.serviceCode"></el-input>
</el-form-item>
<el-form-item :label="ModelServiceFieldsEnums['serviceTypeName']" prop="attributeType">
<el-select v-model="serviceForm.serviceType">
<el-option label="遥调" :value="146"></el-option>
<el-option label="遥控" :value="147"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="ModelServiceFieldsEnums['porder']" prop="porder">
<el-input v-model="serviceForm.porder"></el-input>
</el-form-item>
</el-form>
<template #footer>
<el-button type="primary" @click="submitServiceForm">提交</el-button>
<el-button @click="closeServiceForm">取消</el-button>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { reactive, ref, computed } from 'vue'
import {
ElContainer,
ElAside,
ElHeader,
ElMain,
ElTree,
ElInput,
ElMessage,
ElRadioGroup,
ElRadio,
ElButton,
ElTabs,
ElTabPane,
ElTable,
FormInstance,
} from 'element-plus'
import { Reading, DocumentAdd, DocumentChecked, DocumentDelete, Search, Plus, Download, Upload } from '@element-plus/icons-vue'
import {
ModelFieldsEnums,
AddModelType,
UpdateModelType,
ModelDialogTitleStateType,
ModelDialogTitleStateValueType,
ModelDialogTitleStateKeyType,
radioGroupType,
modelTabsTypeKeyType,
modelTabsType,
AddModelAttributeType,
UpdateModelAttributeType,
UpdateModelServiceType,
AddModelServiceType,
ModelAttributeFieldsEnums,
ModelAttributeTableType,
ModelServiceTableType,
ModelServiceFieldsEnums,
AttributeDialogTitleStateType,
serviceDialogTitleStateType,
} from './type'
import {
getModelListReq,
addModelReq,
updateModelReq,
delModelReq,
getModelAttributeListReq,
addModelAttributeReq,
updateModelAttributeReq,
delModelAttributeReq,
getModelServiceListReq,
addModelServiceReq,
updateModelServiceReq,
delModelServiceReq,
downloadModelReq,
} from './request'
import ContextMenu from './contextMenu.vue'
import { debounce } from 'lodash'
const DeviceModelPropReplace = {
label: 'iotModelName',
}
const treeData = ref<(AddModelType & UpdateModelType)[]>([])
const originTreeData = ref<(AddModelType & UpdateModelType)[]>([])
const searchModelValue = ref('')
const searchModel = () => {
if (searchModelValue.value === '') {
treeData.value = originTreeData.value
return
}
const reg = new RegExp(searchModelValue.value)
const result = []
for (let item of originTreeData.value) {
if (reg.test(item.iotModelName)) {
result.push(item)
}
}
treeData.value = result
}
const debounceSearchModel = debounce(searchModel, 100)
const modelFormRef = ref<FormInstance>()
const modelDialogVisible = ref(false)
const modelDialogState = ref<ModelDialogTitleStateValueType>(ModelDialogTitleStateType['detail'])
const modelDialogTitle = computed(() => {
return modelDialogState.value === ModelDialogTitleStateType['detail']
? '查看物模型'
: modelDialogState.value === ModelDialogTitleStateType['edit']
? '新增物模型'
: '编辑物模型'
})
const originModelForm: AddModelType & UpdateModelType = {
iotModelName: '',
objectType: null,
iotModelCode: '',
revision: 1,
createdBy: undefined,
createdTime: undefined,
updatedBy: undefined,
updatedTime: undefined,
id: null,
}
const modelForm = ref<AddModelType & UpdateModelType>(JSON.parse(JSON.stringify(originModelForm)))
const modelFormRules = {
iotModelName: [{ required: true, message: '请输入物模型名称', trigger: 'blur' }],
iotModelCode: [{ required: true, message: '请输入物模型编码', trigger: 'blur' }],
objectType: [{ required: true, message: '请选择物模型类型', trigger: 'blur' }],
}
const submitModelForm = () => {
if (modelDialogState.value === ModelDialogTitleStateType['add']) {
addModelReq(modelForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('新增物模型成功')
modelDialogVisible.value = false
getModelList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '新增失败')
})
} else if (modelDialogState.value === ModelDialogTitleStateType['edit']) {
updateModelReq(modelForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('修改物模型成功')
modelDialogVisible.value = false
getModelList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '修改失败')
})
}
}
const getModelList = (name?: string) => {
return new Promise((resolve) => {
getModelListReq({ iotModelName: name })
.then((res) => {
if (res.success) {
originTreeData.value = res.data!
treeData.value = res.data!
resolve(res.data![0])
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '查询失败')
})
})
}
const cancelModelForm = () => {
modelForm.value = JSON.parse(JSON.stringify(originModelForm))
modelFormRef.value?.resetFields()
modelDialogVisible.value = false
}
const modelOperateVisible = ref(false)
const contextMenuPos = ref({
x: 0,
y: 0,
})
const curContextMenuTreeData = ref<AddModelType & UpdateModelType>()
const modelContextMenu = (event: MouseEvent, data: AddModelType & UpdateModelType) => {
contextMenuPos.value.x = event.pageX
contextMenuPos.value.y = event.pageY
curContextMenuTreeData.value = JSON.parse(JSON.stringify(data))
modelOperateVisible.value = true
}
const closeModelOperate = () => {
modelOperateVisible.value = false
}
const modelNodeClick = (target: AddModelType & UpdateModelType) => {
curContextMenuTreeData.value = JSON.parse(JSON.stringify(target))
if (ModelTabs.value === 'attribute') {
getAttributeList()
} else {
getServiceList()
}
}
const openModel = (type: ModelDialogTitleStateKeyType, data?: AddModelType & UpdateModelType) => {
modelDialogState.value = ModelDialogTitleStateType[type]
if (type !== 'add') {
modelForm.value = data!
}
// modelOperateVisible.value = false
modelDialogVisible.value = true
}
const delModel = () => {
delModelReq({ id: curContextMenuTreeData.value!.id! })
.then((res) => {
if (res.success) {
ElMessage.success('删除物模型成功')
getModelList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '删除失败')
})
closeModelOperate()
}
const searchModelAttribute = () => {}
const modelAttributeSearchRadio = ref<radioGroupType>('attributeName')
const ModelTabs = ref<modelTabsTypeKeyType>('attribute')
const changeTabs = (name: any) => {
if (name === 'attribute') {
getAttributeList()
} else {
getServiceList()
}
}
const attributeTableData = ref<(AddModelAttributeType & UpdateModelAttributeType)[]>([])
const editAttributeForm = (data: AddModelAttributeType & UpdateModelAttributeType) => {
attributeFormTitle.value = AttributeDialogTitleStateType['edit']
attributeForm.value = JSON.parse(JSON.stringify(data))
attributeVisible.value = true
}
const delAttributeForm = (data: AddModelAttributeType & UpdateModelAttributeType) => {
delModelAttributeReq({ id: data.id! })
.then((res) => {
if (res.success) {
ElMessage.success('删除物模型属性成功')
getAttributeList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '删除失败')
})
}
const getAttributeList = () => {
getModelAttributeListReq({ iotModelId: curContextMenuTreeData.value!.id! })
.then((res) => {
if (res.success) {
attributeTableData.value = res.data!.map((item) => {
return {
...item,
attributeTypeName:
item.attributeType === 138
? '模拟量'
: item.attributeType === 139
? '累积量'
: item.attributeType === 140
? '离散量'
: item.attributeType,
}
})
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '查询失败')
})
}
const getServiceList = () => {
getModelServiceListReq({ iotModelId: curContextMenuTreeData.value!.id! })
.then((res) => {
if (res.success) {
serviceTableData.value = res.data!.map((item) => {
return {
...item,
serviceTypeName: item.serviceType === 146 ? '遥调' : item.serviceType === 147 ? '遥控' : item.serviceType,
}
})
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '查询失败')
})
}
const serviceTableData = ref<(AddModelServiceType & UpdateModelServiceType)[]>([])
const editServiceForm = (data: AddModelServiceType & UpdateModelServiceType) => {
serviceFormTitle.value = serviceDialogTitleStateType['edit']
serviceForm.value = JSON.parse(JSON.stringify(data))
serviceVisible.value = true
}
const delServiceForm = (data: AddModelServiceType & UpdateModelServiceType) => {
delModelServiceReq({ id: data.id! })
.then((res) => {
if (res.success) {
ElMessage.success('删除物模型方法成功')
getServiceList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '删除失败')
})
}
const attributeVisible = ref(false)
const attributeFormTitle = ref(AttributeDialogTitleStateType['add'])
const originAttributeForm: AddModelAttributeType & UpdateModelAttributeType = {
id: null,
iotModelId: '',
attributeCode: '',
attributeName: '',
attributeType: null,
porder: null,
revision: 1,
createdBy: undefined,
createdTime: undefined,
updatedBy: undefined,
updatedTime: undefined,
}
const attributeFormRef = ref<FormInstance>()
const attributeForm = ref<AddModelAttributeType & UpdateModelAttributeType>(JSON.parse(JSON.stringify(originAttributeForm)))
const closeAttributeForm = () => {
attributeVisible.value = false
attributeForm.value = JSON.parse(JSON.stringify(originAttributeForm))
attributeFormRef.value?.resetFields()
}
const submitAttributeForm = () => {
attributeFormRef.value?.validate((valid) => {
if (valid) {
if (attributeFormTitle.value === AttributeDialogTitleStateType['add']) {
attributeForm.value.iotModelId = curContextMenuTreeData.value!.id!
addModelAttributeReq(attributeForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('新增物模型属性成功')
closeAttributeForm()
getAttributeList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '新增失败')
})
} else if (attributeFormTitle.value === AttributeDialogTitleStateType['edit']) {
updateModelAttributeReq(attributeForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('修改物模型属性成功')
closeAttributeForm()
getAttributeList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '修改失败')
})
}
}
})
}
const serviceVisible = ref(false)
const serviceFormTitle = ref(serviceDialogTitleStateType['add'])
const originServiceForm: AddModelServiceType & UpdateModelServiceType = {
id: null,
iotModelId: '',
serviceCode: '',
serviceName: '',
serviceType: null,
porder: null,
revision: 1,
createdBy: undefined,
createdTime: undefined,
updatedBy: undefined,
updatedTime: undefined,
}
const serviceFormRef = ref<FormInstance>()
const serviceForm = ref<AddModelServiceType & UpdateModelServiceType>(JSON.parse(JSON.stringify(originServiceForm)))
const closeServiceForm = () => {
serviceVisible.value = false
serviceForm.value = JSON.parse(JSON.stringify(originServiceForm))
serviceFormRef.value?.resetFields()
}
const submitServiceForm = () => {
serviceFormRef.value?.validate((valid) => {
if (valid) {
if (serviceFormTitle.value === serviceDialogTitleStateType['add']) {
serviceForm.value.iotModelId = curContextMenuTreeData.value!.id!
addModelServiceReq(serviceForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('新增物模型方法成功')
closeServiceForm()
getServiceList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '新增失败')
})
} else if (serviceFormTitle.value === serviceDialogTitleStateType['edit']) {
updateModelServiceReq(serviceForm.value)
.then((res) => {
if (res.success) {
ElMessage.success('修改物模型方法成功')
closeServiceForm()
getServiceList()
} else {
ElMessage.error(res.msg)
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '修改失败')
})
}
}
})
}
const addModelAttributeAndService = () => {
if (ModelTabs.value === 'attribute') {
attributeVisible.value = true
} else {
serviceVisible.value = true
}
}
const upLoadModel = () => {}
const downLoadModel = () => {
downloadModelReq({ id: curContextMenuTreeData.value!.id! }).then((res: any) => {
const downloadUrl = window.URL.createObjectURL(res)
const a = document.createElement('a')
a.href = downloadUrl
a.download = '物模型' + new Date().getTime()
document.body.appendChild(a)
a.click()
window.URL.revokeObjectURL(downloadUrl)
document.body.removeChild(a)
})
}
const currentPage = ref(1)
const currentPageSize = ref(10)
const pageTotal = ref(0)
const pagePagination = ref([10, 20, 30])
getModelList().then((res) => {
curContextMenuTreeData.value = JSON.parse(JSON.stringify(res))
if (ModelTabs.value === 'attribute') {
getAttributeList()
} else {
getServiceList()
}
})
</script>
<style lang="scss" scoped>
$headerHeight: 60px;
$defaultBackgroundColor: #fff;
$defaultAsideWidth: 260px;
$paginationHeight: 32px;
.DeviceModel {
position: relative;
width: 100%;
height: 100%;
.containerPart {
width: 100%;
height: 100%;
.asidePart {
width: $defaultAsideWidth;
height: 100%;
border-right: 1px solid #eaebed;
.asideHeader {
display: flex;
justify-content: center;
align-items: center;
.searchModelInput {
height: 40px;
}
}
.asideMain {
height: calc(100% - $headerHeight);
overflow-y: auto;
.modelTree {
height: 100%;
background-color: $defaultBackgroundColor;
}
}
}
.mainContainer {
width: calc(100% - $defaultAsideWidth);
height: 100%;
.mainHeader {
display: flex;
justify-content: space-between;
align-items: center;
height: $headerHeight;
padding: 0 20px;
border-bottom: 1px solid #eaebed;
.modelAttributeSearchInput {
height: 40px;
width: 220px;
}
.mainHeaderCenter {
display: flex;
justify-content: space-between;
align-items: center;
width: 445px;
}
.mainHeaderRight {
display: flex;
justify-content: space-between;
align-items: center;
}
}
.mainMain {
height: calc(100% - $headerHeight);
.tabsPart {
height: calc(100% - $paginationHeight);
:deep(.el-tabs__content) {
height: calc(100% - 55px);
.el-tab-pane {
height: 100%;
}
}
.tablePart {
height: 100%;
}
.tableOperate {
display: flex;
justify-content: center;
align-items: center;
a {
margin: 5px;
color: #0064aa;
font-weight: 600;
&:hover {
cursor: pointer;
}
}
}
}
.mainFooter {
display: flex;
justify-content: right;
background-color: #fff;
}
}
}
}
.modelOperate {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
width: 80px;
height: 200px;
.el-button {
margin: 0;
}
}
}
</style>

102
ui/dasadmin/src/views/backend/DeviceModel/contextMenu.vue Normal file
View File

@ -0,0 +1,102 @@
<template>
<div
v-show="props.visible"
class="moveContextMenu"
:style="{
left: props.pos.x - 60 + 'px',
top: props.pos.y + 11 + 'px',
}"
>
<div class="contextMenu">
<div class="arrowBorder"></div>
<div class="arrow"></div>
<div class="modelOperate">
<slot name="default"></slot>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { watch } from 'vue'
const props = defineProps({
pos: {
type: Object,
default: {
x: 0,
y: 0,
},
},
visible: {
type: Boolean,
default: true,
},
})
const emits = defineEmits(['update:visible', 'openModel'])
const closeMenu = () => {
emits('update:visible', false)
}
watch(
() => props.visible,
() => {
if (props.visible) {
document.body.addEventListener('click', closeMenu)
} else {
document.body.removeEventListener('click', closeMenu)
}
}
)
</script>
<style lang="scss" scoped>
$defaultWidth: 80px;
$defaultHeight: 150px;
$defaultPadding: 20px;
.moveContextMenu {
position: fixed;
.contextMenu {
position: relative;
padding: $defaultPadding;
width: $defaultWidth + $defaultPadding * 2;
height: $defaultHeight + $defaultPadding * 2;
background-color: #fff;
border-radius: 10px;
border: 1px solid #e4e7ed;
.modelOperate {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
width: $defaultWidth;
height: $defaultHeight;
.el-button {
margin: 0;
}
}
.arrow {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -100%);
width: 0;
height: 0;
border-bottom: 10px solid #fff;
border-left: 9px solid transparent;
border-right: 9px solid transparent;
}
.arrowBorder {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -100%);
width: 0;
height: 0;
border-bottom: 11px solid #e4e7ed;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
}
}
}
</style>

60
ui/dasadmin/src/views/backend/DeviceModel/customTable.vue Normal file
View File

@ -0,0 +1,60 @@
<template>
<el-table :data="tableData" class="tablePart">
<el-table-column
v-for="item in tableColumn"
:key="item.key"
:prop="item.prop"
:label="item.label"
:fixed="item.fixed"
:align="item.align ?? 'center'"
></el-table-column>
<el-table-column fixed="right" label="操作" min-width="80" align="center">
<template #default="scope">
<div class="tableOperate">
<a @click="editForm(scope.row)">编辑</a>
<a>|</a>
<el-popconfirm title="确定删除么？" @confirm="delForm(scope.row)">
<template #reference>
<a>删除</a>
</template>
</el-popconfirm>
</div>
</template>
</el-table-column>
</el-table>
</template>
<script setup lang="ts">
import { ElTable, ElTableColumn } from 'element-plus'
import { defineProps, defineEmits } from 'vue'
const props = defineProps<{
tableData: any[]
tableColumn: any[]
}>()
const emits = defineEmits(['editForm', 'delForm'])
const editForm = (row: any) => {
emits('editForm', row)
}
const delForm = (row: any) => {
emits('delForm', row)
}
</script>
<style lang="scss" scoped>
.tableOperate {
display: flex;
justify-content: center;
align-items: center;
a {
margin: 5px;
color: #0064aa;
font-weight: 600;
&:hover {
cursor: pointer;
}
}
}
</style>

128
ui/dasadmin/src/views/backend/DeviceModel/request.ts Normal file
View File

@ -0,0 +1,128 @@
import createAxios from '/@/utils/axios'
import {
RequestReturnType,
GetModelType,
AddModelType,
UpdateModelType,
DelModelType,
GetModelAttributeType,
AddModelAttributeType,
UpdateModelAttributeType,
DelModelAttributeType,
AddModelServiceType,
UpdateModelServiceType,
} from './type'
export const getModelListReq = (data: GetModelType) => {
return createAxios<never, RequestReturnType<AddModelType[] & UpdateModelType[]>>({
url: '/api/equipment/model/list',
method: 'post',
data: data,
})
}
export const addModelReq = (data: AddModelType) => {
return createAxios<never, RequestReturnType<AddModelType[] & UpdateModelType[]>>({
url: '/api/equipment/model/add',
method: 'post',
data: data,
})
}
export const updateModelReq = (data: UpdateModelType) => {
return createAxios<never, RequestReturnType>({
url: '/api/equipment/model/update',
method: 'post',
data: data,
})
}
export const delModelReq = (data: DelModelType) => {
return createAxios<never, RequestReturnType>({
url: '/api/equipment/model/delete',
method: 'post',
data: data,
})
}
export const getModelAttributeListReq = (data: GetModelAttributeType) => {
return createAxios<never,RequestReturnType<(AddModelAttributeType&UpdateModelAttributeType)[]>>({
url: '/api/equipment/model/attribute/list',
method: 'post',
data: data,
})
}
export const addModelAttributeReq = (data: AddModelAttributeType) => {
return createAxios<never,RequestReturnType<(AddModelAttributeType&UpdateModelAttributeType)[]>>({
url: '/api/equipment/model/attribute/add',
method: 'post',
data: data,
})
}
export const updateModelAttributeReq = (data: UpdateModelAttributeType) => {
return createAxios<never,RequestReturnType>({
url: '/api/equipment/model/attribute/update',
method: 'post',
data: data,
})
}
export const delModelAttributeReq = (data: DelModelAttributeType) => {
return createAxios<never,RequestReturnType>({
url: '/api/equipment/model/attribute/delete',
method: 'post',
data: data,
})
}
export const getModelServiceListReq = (data: GetModelAttributeType) => {
return createAxios<never,RequestReturnType<(AddModelServiceType&UpdateModelServiceType)[]>>({
url: '/api/equipment/model/service/list',
method: 'post',
data: data,
})
}
export const addModelServiceReq = (data: AddModelServiceType) => {
return createAxios<never,RequestReturnType<(AddModelServiceType&UpdateModelServiceType)[]>>({
url: '/api/equipment/model/service/add',
method: 'post',
data: data,
})
}
export const updateModelServiceReq = (data: UpdateModelServiceType) => {
return createAxios<never,RequestReturnType>({
url: '/api/equipment/model/service/update',
method: 'post',
data: data,
})
}
export const delModelServiceReq = (data: DelModelAttributeType) => {
return createAxios<never,RequestReturnType>({
url: '/api/equipment/model/service/delete',
method: 'post',
data: data,
})
}
// export const uploadModel = ()=>{
// return createAxios<never,RequestReturnType>({
// url: ,
// method: 'post',
// data: data,
// })
// }
export const downloadModelReq = (data:{id:string})=>{
return createAxios<never,RequestReturnType>({
url:'/api/equipment/model/export' ,
method: 'post',
data: data,
responseType:'blob'
})
}

156
ui/dasadmin/src/views/backend/DeviceModel/type.ts Normal file
View File

@ -0,0 +1,156 @@
export type RequestReturnType<T = never> = Promise<{
code: number
msg: string
success: boolean
data?: T
}>
export enum ModelFieldsEnums {
'id' = 'id',
'objectType' = '设备类型',
'iotModelCode' = '物模型编码',
'iotModelName' = '物模型名称',
'revision' = '乐观锁',
'createdBy' = '创建人',
'createdTime' = '创建时间',
'updatedBy' = '更新人',
'updatedTime' = '更新时间',
}
export type ModelFieldsJointType = keyof typeof ModelFieldsEnums
export type ModelAttributeType = 138 | 139 | 140
export type ModelServiceType = 146 | 147
export type GetModelType = {
objectType?: number
iotModelName?: string
iotModelCode?: string
}
export type AddModelType = {
objectType: number | null
iotModelName: string
iotModelCode: string
revision: number
createdBy?: string
createdTime?: string
}
export type UpdateModelType = {
id: string | null
updatedBy?: string
updatedTime?: string
} & Omit<AddModelType, 'createdBy' | 'createdTime'>
export type DelModelType = {
id: string
}
export enum ModelAttributeFieldsEnums {
'id' = 'id',
'iotModelId' = '所属物模型ID',
'attributeCode' = '属性编码',
'attributeName' = '属性名称',
'attributeType' = '属性类型value',
'attributeTypeName' = '属性类型',
'porder' = '测点序号',
'revision' = '乐观锁',
'createdBy' = '创建人',
'createdTime' = '创建时间',
'updatedBy' = '更新人',
'updatedTime' = '更新时间',
}
export enum ModelServiceFieldsEnums {
'id' = 'id',
'iotModelId' = '所属物模型ID',
'serviceCode' = '属性编码',
'serviceName' = '属性名称',
'serviceType' = '属性类型value',
'serviceTypeName' = '属性类型',
'porder' = '测点序号',
'revision' = '乐观锁',
'createdBy' = '创建人',
'createdTime' = '创建时间',
'updatedBy' = '更新人',
'updatedTime' = '更新时间',
}
export type GetModelAttributeType = {
iotModelId: string
}
export type AddModelAttributeType = {
iotModelId: string
attributeCode: string
attributeName: string
attributeType: ModelAttributeType | null
porder: number | null
revision: number
createdBy?: string
createdTime?: string
}
export type UpdateModelAttributeType = {
id: string | null
updatedBy?: string
updatedTime?: string
} & Omit<AddModelAttributeType, 'createdBy' | 'createdTime'>
export type DelModelAttributeType = {
id: string
}
export type AddModelServiceType = {
iotModelId: string
serviceCode: string
serviceName: string
serviceType: ModelServiceType | null
porder: number | null
revision: number
createdBy?: string
createdTime?: string
}
export type UpdateModelServiceType = {
id: string | null
updatedBy?: string
updatedTime?: string
} & Omit<AddModelServiceType, 'createdBy' | 'createdTime'>
export enum ModelDialogTitleStateType {
'add' = '新增物模型',
'edit' = '编辑物模型',
'detail' = '查看物模型',
}
export type ModelDialogTitleStateKeyType = keyof typeof ModelDialogTitleStateType
export type ModelDialogTitleStateValueType = `${ModelDialogTitleStateType}`
export type radioGroupType = keyof Pick<AddModelAttributeType, 'attributeCode' | 'attributeName'>
export enum modelTabsType {
'attribute' = '属性',
'service' = '方法',
}
export type modelTabsTypeKeyType = keyof typeof modelTabsType
export type ModelAttributeTableType = AddModelAttributeType &
UpdateModelAttributeType & {
attributeTypeName: string
}
export type ModelServiceTableType = AddModelServiceType &
UpdateModelServiceType & {
serviceTypeName: string
}
export enum AttributeDialogTitleStateType {
'add' = '新增物模型属性',
'edit' = '编辑物模型属性',
}
export enum serviceDialogTitleStateType {
'add' = '新增物模型方法',
'edit' = '编辑物模型方法',
}

3
ui/dasadmin/src/views/backend/userInfo/userInfo.vue
View File

@ -66,6 +66,7 @@
autocomplete="new-password"
:placeholder="t('userInfo.Please enter your old password')"
v-model="state.passWordInfo.oldPassword"
show-password
></el-input>
</el-form-item>
<el-form-item :label="t('userInfo.New password')" prop="newPassword">
@ -74,6 +75,7 @@
autocomplete="new-password"
:placeholder="t('userInfo.Please enter Your New password')"
v-model="state.passWordInfo.newPassword"
show-password
></el-input>
</el-form-item>
<el-form-item :label="t('userInfo.New Repeat password')" prop="repeatPassword">
@ -82,6 +84,7 @@
autocomplete="new-password"
:placeholder="t('userInfo.Please enter your password again')"
v-model="state.passWordInfo.repeatPassword"
show-password
></el-input>
</el-form-item>
</el-form>