物模型：table添加排序
This commit is contained in:
高云鹏
parent
573df6322e
commit
c32aabd3ca
@ -90,24 +90,33 @@
|
||||
<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" highlight-current-row>
|
||||
<el-table :data="attributeTableData" @sort-change="sortChange" class="tablePart" highlight-current-row>
|
||||
<el-table-column
|
||||
prop="porder"
|
||||
:label="ModelAttributeFieldsEnums['porder']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
width="80"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="attributeName"
|
||||
:label="ModelAttributeFieldsEnums['attributeName']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="attributeCode"
|
||||
:label="ModelAttributeFieldsEnums['attributeCode']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="attributeTypeName"
|
||||
:label="ModelAttributeFieldsEnums['attributeTypeName']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></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">
|
||||
<el-table-column fixed="right" label="操作" width="130" align="center">
|
||||
<template #default="scope">
|
||||
<div class="tableOperate">
|
||||
<a @click="editAttributeForm(scope.row)">编辑</a>
|
||||
@ -123,15 +132,32 @@
|
||||
</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 :data="serviceTableData" @sort-change="sortChange" class="tablePart">
|
||||
<el-table-column
|
||||
prop="porder"
|
||||
:label="ModelServiceFieldsEnums['porder']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
width="80"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="serviceName"
|
||||
:label="ModelServiceFieldsEnums['serviceName']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="serviceCode"
|
||||
:label="ModelServiceFieldsEnums['serviceCode']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="serviceTypeName"
|
||||
:label="ModelServiceFieldsEnums['serviceTypeName']"
|
||||
align="center"
|
||||
sortable="custom"
|
||||
></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">
|
||||
@ -479,15 +505,15 @@ const modelAttributeAndServiceInputValue = ref('')
|
||||
const searchModelAttribute = () => {
|
||||
if (modelAttributeSearchRadio.value === 'Name') {
|
||||
if (ModelTabs.value === 'attribute') {
|
||||
getAttributeList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
getAttributeList({ type: modelAttributeSearchRadio.value, value: modelAttributeAndServiceInputValue.value })
|
||||
} else if (ModelTabs.value === 'service') {
|
||||
getServiceList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
getServiceList({ type: modelAttributeSearchRadio.value, value: modelAttributeAndServiceInputValue.value })
|
||||
}
|
||||
} else if (modelAttributeSearchRadio.value === 'Code') {
|
||||
if (ModelTabs.value === 'attribute') {
|
||||
getAttributeList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
getAttributeList({ type: modelAttributeSearchRadio.value, value: modelAttributeAndServiceInputValue.value })
|
||||
} else if (ModelTabs.value === 'service') {
|
||||
getServiceList(modelAttributeSearchRadio.value, modelAttributeAndServiceInputValue.value)
|
||||
getServiceList({ type: modelAttributeSearchRadio.value, value: modelAttributeAndServiceInputValue.value })
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -502,6 +528,20 @@ const changeTabs = (name: any) => {
|
||||
getServiceList()
|
||||
}
|
||||
}
|
||||
const sortChange = ({
|
||||
prop,
|
||||
order,
|
||||
}: {
|
||||
prop: keyof typeof ModelAttributeFieldsEnums | keyof typeof ModelServiceFieldsEnums
|
||||
order: 'ascending' | 'descending' | null
|
||||
}) => {
|
||||
const orderType = order === 'ascending' ? 'asc' : order === 'descending' ? 'desc' : undefined
|
||||
if (ModelTabs.value === 'attribute') {
|
||||
getAttributeList({ orderFiled: order ? (prop as keyof typeof ModelAttributeFieldsEnums) : undefined, order: orderType })
|
||||
} else if (ModelTabs.value === 'service') {
|
||||
getServiceList({ orderFiled: order ? (prop as keyof typeof ModelServiceFieldsEnums) : undefined, order: orderType })
|
||||
}
|
||||
}
|
||||
|
||||
const attributeTableData = ref<ModelAttributeTableType[]>([])
|
||||
const editAttributeForm = (data: AddModelAttributeType & UpdateModelAttributeType) => {
|
||||
@ -524,11 +564,23 @@ const delAttributeForm = (data: AddModelAttributeType & UpdateModelAttributeType
|
||||
})
|
||||
}
|
||||
|
||||
const getAttributeList = (type?: radioGroupType, value?: string) => {
|
||||
const getAttributeList = ({
|
||||
type,
|
||||
value,
|
||||
order,
|
||||
orderFiled,
|
||||
}: {
|
||||
type?: radioGroupType
|
||||
value?: string
|
||||
order?: 'asc' | 'desc' | undefined
|
||||
orderFiled?: keyof typeof ModelAttributeFieldsEnums
|
||||
} = {}) => {
|
||||
const requestData: GetModelAttributeType = {
|
||||
iotModelId: curContextMenuTreeData.value!.id!,
|
||||
pageNum: currentPage.value,
|
||||
pageSize: currentPageSize.value,
|
||||
orderColumn: orderFiled,
|
||||
orderType: order,
|
||||
}
|
||||
if (type === 'Name') {
|
||||
requestData.attributeName = value
|
||||
@ -568,11 +620,23 @@ const getAttributeList = (type?: radioGroupType, value?: string) => {
|
||||
})
|
||||
}
|
||||
|
||||
const getServiceList = (type?: radioGroupType, value?: string) => {
|
||||
const getServiceList = ({
|
||||
type,
|
||||
value,
|
||||
order,
|
||||
orderFiled,
|
||||
}: {
|
||||
type?: radioGroupType
|
||||
value?: string
|
||||
order?: 'asc' | 'desc'
|
||||
orderFiled?: keyof typeof ModelServiceFieldsEnums
|
||||
} = {}) => {
|
||||
const requestData: GetModelServiceType = {
|
||||
iotModelId: curContextMenuTreeData.value!.id!,
|
||||
pageNum: currentPage.value,
|
||||
pageSize: currentPageSize.value,
|
||||
orderColumn: orderFiled,
|
||||
orderType: order,
|
||||
}
|
||||
if (type === 'Name') {
|
||||
requestData.serviceName = value
|
||||
|
||||
@ -94,6 +94,8 @@ export type GetModelAttributeType = {
|
||||
attributeName?: string
|
||||
pageSize: number
|
||||
pageNum: number
|
||||
orderColumn: keyof typeof ModelAttributeFieldsEnums | undefined
|
||||
orderType: 'desc' | 'asc' | undefined
|
||||
}
|
||||
|
||||
export type attributeTypeDataType = "float" | "double" | "tinyint" | "smallint" | "int" | "bigint"
|
||||
@ -128,6 +130,8 @@ export type GetModelServiceType = {
|
||||
serviceName?: string
|
||||
pageSize: number
|
||||
pageNum: number
|
||||
orderColumn?: keyof typeof ModelServiceFieldsEnums
|
||||
orderType?: 'desc' | 'asc'
|
||||
}
|
||||
|
||||
export type AddModelServiceType = {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user