parent
8ef17fda16
commit
00716a2f63
@ -0,0 +1,44 @@ |
||||
import { AxiosPromise } from "axios"; |
||||
import { ServicePageResult } from "@/api/service/types"; |
||||
import request from "@/utils/request"; |
||||
|
||||
export function tr069ServiceList( |
||||
data: PageQuery, |
||||
tr069VerId: number |
||||
): AxiosPromise<ServicePageResult> { |
||||
return request({ |
||||
url: `/api/service/v1/tr069-service-list/${tr069VerId}`, |
||||
method: "POST", |
||||
data, |
||||
}); |
||||
} |
||||
export function noBindingServiceList( |
||||
data: PageQuery, |
||||
tr069VerId: number |
||||
): AxiosPromise<ServicePageResult> { |
||||
return request({ |
||||
url: `/api/service/v1/no-binding-service/${tr069VerId}`, |
||||
method: "POST", |
||||
data, |
||||
}); |
||||
} |
||||
|
||||
export function bindingTr069Service( |
||||
data: number[], |
||||
tr069VerId: number |
||||
): AxiosPromise<ServicePageResult> { |
||||
return request({ |
||||
url: `/api/service/v1/binding-service/${tr069VerId}`, |
||||
method: "POST", |
||||
data, |
||||
}); |
||||
} |
||||
export function removeBindingTr069Service( |
||||
servId: number, |
||||
tr069VerId: number |
||||
): AxiosPromise<ServicePageResult> { |
||||
return request({ |
||||
url: `/api/service/v1/remove-binding-service/${servId}/${tr069VerId}`, |
||||
method: "DELETE", |
||||
}); |
||||
} |
||||
@ -0,0 +1,10 @@ |
||||
import { DeviceServiceVO } from "@/api/device-type-ver/types"; |
||||
|
||||
export interface ServiceVO { |
||||
servId?: number; |
||||
servName?: string; |
||||
servVerName?: string; |
||||
servDisplayName?: string; |
||||
servDesc?: string; |
||||
} |
||||
export type ServicePageResult = PageResult<ServiceVO[]>; |
||||
@ -0,0 +1,103 @@ |
||||
<template> |
||||
<div class="app-container"> |
||||
<el-card shadow="never"> |
||||
<template #header> |
||||
<div style="display: flex; justify-content: flex-end"> |
||||
<el-button |
||||
type="primary" |
||||
:disabled="multipleSelection.length === 0" |
||||
plain |
||||
@click="bindingService" |
||||
:icon="Position" |
||||
>绑定</el-button |
||||
> |
||||
</div> |
||||
</template> |
||||
<div class="any-table"> |
||||
<el-table |
||||
:data="serviceList" |
||||
highlight-current-row |
||||
v-loading="loading" |
||||
max-height="400" |
||||
@selection-change="handleSelectionChange" |
||||
> |
||||
<el-table-column type="selection" width="55" /> |
||||
<el-table-column label="业务名称" prop="servName" align="center" /> |
||||
<el-table-column label="业务版本" prop="servVerName" align="center" /> |
||||
<el-table-column |
||||
label="业务显示名称" |
||||
prop="servDisplayName" |
||||
align="center" |
||||
/> |
||||
<el-table-column label="业务描述" prop="servDesc" align="center" /> |
||||
</el-table> |
||||
<pagination |
||||
v-if="totalService > 0" |
||||
v-model:total="totalService" |
||||
v-model:page="serviceQuery.pageNum" |
||||
v-model:limit="serviceQuery.pageSize" |
||||
@pagination="loadService" |
||||
/> |
||||
</div> |
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { |
||||
bindingTr069Service, |
||||
noBindingServiceList, |
||||
} from "@/api/service"; |
||||
import { ServiceVO } from "@/api/service/types"; |
||||
import { Position } from "@element-plus/icons-vue"; |
||||
const route = useRoute(); |
||||
let tr069VerId: number = parseInt(<string>route.params.tr069VerId); |
||||
const totalService = ref<number>(0); |
||||
const loading = ref<boolean>(false); |
||||
const multipleSelection = ref<ServiceVO[]>([]); |
||||
const serviceList = ref<ServiceVO[]>([]); |
||||
const serviceQuery = ref<PageQuery>({ |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}); |
||||
const loadService = () => { |
||||
loading.value = true; |
||||
noBindingServiceList(serviceQuery.value, tr069VerId) |
||||
.then(({ data }) => { |
||||
serviceList.value = data.list; |
||||
totalService.value = data.total; |
||||
}) |
||||
.finally(() => { |
||||
loading.value = false; |
||||
}); |
||||
}; |
||||
const handleSelectionChange = (val: ServiceVO[]) => { |
||||
multipleSelection.value = val; |
||||
}; |
||||
const bindingService = () => { |
||||
let ids: number[] = []; |
||||
multipleSelection.value.forEach((obj) => { |
||||
ids.push(<number>obj.servId); |
||||
}); |
||||
loading.value = true; |
||||
bindingTr069Service(ids, tr069VerId) |
||||
.then(() => { |
||||
ElMessage({ |
||||
message: "操作成功", |
||||
type: "success", |
||||
duration: 1000, |
||||
onClose: () => { |
||||
loadService(); |
||||
}, |
||||
}); |
||||
}) |
||||
.finally(() => { |
||||
loading.value = false; |
||||
}); |
||||
}; |
||||
onMounted(() => { |
||||
loadService(); |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped></style> |
||||
@ -0,0 +1,106 @@ |
||||
<template> |
||||
<div class="app-container"> |
||||
<el-card shadow="never"> |
||||
<template #header> |
||||
<div style="display: flex; justify-content: flex-end"> |
||||
<el-button |
||||
:icon="Plus" |
||||
type="primary" |
||||
plain |
||||
@click="skipBindingService" |
||||
>新增</el-button |
||||
> |
||||
</div> |
||||
</template> |
||||
<div class="any-table"> |
||||
<el-table |
||||
:data="serviceList" |
||||
highlight-current-row |
||||
v-loading="loading" |
||||
max-height="400" |
||||
> |
||||
<el-table-column label="业务名称" prop="servName" align="center" /> |
||||
<el-table-column label="业务版本" prop="servVerName" align="center" /> |
||||
<el-table-column |
||||
label="业务显示名称" |
||||
prop="servDisplayName" |
||||
align="center" |
||||
/> |
||||
<el-table-column label="业务描述" prop="servDesc" align="center" /> |
||||
<el-table-column label="操作" align="center"> |
||||
<template #default="scope"> |
||||
<el-popconfirm |
||||
title="确定要解除绑定吗?" |
||||
width="180" |
||||
:icon="InfoFilled" |
||||
icon-color="#00c3ee" |
||||
@confirm="removeBinding(scope.row.servId)" |
||||
> |
||||
<template #reference> |
||||
<el-button type="primary" :icon="CloseBold" link>解除绑定</el-button> |
||||
</template> |
||||
</el-popconfirm> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
<pagination |
||||
v-if="totalService > 0" |
||||
v-model:total="totalService" |
||||
v-model:page="serviceQuery.pageNum" |
||||
v-model:limit="serviceQuery.pageSize" |
||||
@pagination="loadService" |
||||
/> |
||||
</div> |
||||
</el-card> |
||||
</div> |
||||
</template> |
||||
|
||||
<script setup lang="ts"> |
||||
import { removeBindingTr069Service, tr069ServiceList } from "@/api/service"; |
||||
import { CloseBold, InfoFilled, Plus } from "@element-plus/icons-vue"; |
||||
import { ServiceVO } from "@/api/service/types"; |
||||
const route = useRoute(); |
||||
const router = useRouter(); |
||||
let tr069VerId: number = parseInt(<string>route.params.tr069VerId); |
||||
const totalService = ref<number>(0); |
||||
const loading = ref<boolean>(false); |
||||
const serviceList = ref<ServiceVO[]>([]); |
||||
const serviceQuery = ref<PageQuery>({ |
||||
pageNum: 1, |
||||
pageSize: 10, |
||||
}); |
||||
const loadService = () => { |
||||
loading.value = true; |
||||
tr069ServiceList(serviceQuery.value, tr069VerId) |
||||
.then(({ data }) => { |
||||
serviceList.value = data.list; |
||||
totalService.value = data.total; |
||||
}) |
||||
.finally(() => { |
||||
loading.value = false; |
||||
}); |
||||
}; |
||||
const skipBindingService = () => { |
||||
router.push({ |
||||
path: `/resources/binding-service/${tr069VerId}`, |
||||
}); |
||||
}; |
||||
const removeBinding = (servId: number) => { |
||||
loading.value = true; |
||||
removeBindingTr069Service(servId, tr069VerId).then(() => { |
||||
ElMessage({ |
||||
message: "操作成功", |
||||
type: "success", |
||||
duration: 1000, |
||||
onClose: () => { |
||||
loadService(); |
||||
}, |
||||
}); |
||||
}); |
||||
}; |
||||
onMounted(() => { |
||||
loadService(); |
||||
}); |
||||
</script> |
||||
|
||||
<style scoped></style> |
||||
Loading…
Reference in new issue