Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev
# Conflicts: # src/router/menu.ts
This commit is contained in:
commit
cc07ccb19d
Binary file not shown.
After Width: | Height: | Size: 3.9 KiB |
|
@ -99,4 +99,24 @@ export const batchDeleteDevice = (data: string[]) => server.put(`/device-instanc
|
|||
* @returns
|
||||
*/
|
||||
export const deviceExport = (productId: string, type: string) => `${BASE_API_PATH}/device-instance${!!productId ? '/' + productId : ''}/export.${type}`
|
||||
|
||||
|
||||
/**
|
||||
* 验证设备ID是否重复
|
||||
* @param id 设备id
|
||||
* @returns
|
||||
*/
|
||||
export const isExists = (id: string) => server.get(`/device-instance/${id}/exists`)
|
||||
|
||||
/**
|
||||
* 修改设备信息
|
||||
* @param data 设备信息
|
||||
* @returns
|
||||
*/
|
||||
export const update = (data: Partial<DeviceInstance>) => data.id ? server.patch(`/device-instance`, data) : server.post(`/device-instance`, data)
|
||||
|
||||
/**
|
||||
* 获取配置信息
|
||||
* @param id 设备id
|
||||
* @returns
|
||||
*/
|
||||
export const getConfigMetadata = (id: string) => server.get(`/device-instance/${id}/config-metadata`)
|
||||
|
|
|
@ -64,4 +64,37 @@ export const sync = () => server.get(`/network/card/state/_sync`);
|
|||
* 批量删除物联卡
|
||||
* @param data
|
||||
*/
|
||||
export const removeCards = (data: any) => server.post(`/network/card/batch/_delete`, data);
|
||||
export const removeCards = (data: any) => server.post(`/network/card/batch/_delete`, data);
|
||||
|
||||
/**
|
||||
* 解绑设备
|
||||
* @param cardId
|
||||
*/
|
||||
export const unbind = (cardId: string) => server.get(`/network/card/${cardId}/_unbind`);
|
||||
|
||||
/**
|
||||
* 分页查询未绑定设备列表
|
||||
* @param data
|
||||
*/
|
||||
export const queryUnbounded = (data: any) => server.post(`/network/card/unbounded/device/_query`, data);
|
||||
|
||||
/**
|
||||
* 绑定设备
|
||||
* @param cardId
|
||||
* @param deviceId 选择的设备id
|
||||
*/
|
||||
export const bind = (cardId: string | any, deviceId: string) => server.get(`/network/card/${cardId}/${deviceId}/_bind`);
|
||||
|
||||
/**
|
||||
* 导入物联卡实例
|
||||
* @param configId 对接平台id
|
||||
* @param params
|
||||
*/
|
||||
export const _import = (configId: any, params: any) => server.get(`/network/card/${configId}/_import`, params);
|
||||
|
||||
/**
|
||||
* 根据id批量导出
|
||||
* @param format 类型 xlsx、csv
|
||||
* @param params
|
||||
*/
|
||||
export const _export = (format: string, data: any) => server.post(`/network/card/download.${format}/_query`, data, 'blob');
|
|
@ -1,3 +1,13 @@
|
|||
import server from '@/utils/request'
|
||||
import server from '@/utils/request';
|
||||
|
||||
export const queryOwnThree = (data: any) => server.post<any>('/menu/user-own/tree', data)
|
||||
// 获取当前用户可访问菜单
|
||||
export const getMenuTree_api = (data: object) => server.post(`/menu/_all/tree`, data);
|
||||
|
||||
export const queryOwnThree = (data: any) => server.post<any>('/menu/user-own/tree', data)
|
||||
|
||||
|
||||
|
||||
// 获取资产类型
|
||||
export const getAssetsType_api = () => server.get(`/asset/types`);
|
||||
// 获取菜单详情
|
||||
export const getMenuDetail_api = (id:string) => server.get(`/menu/${id}`);
|
||||
|
|
|
@ -232,6 +232,17 @@ const handleClick = () => {
|
|||
:deep(.card-item-content-title) {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
:deep(.card-item-heard-name) {
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
:deep(.card-item-content-text) {
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-mask {
|
||||
|
|
|
@ -15,14 +15,14 @@
|
|||
v-bind="props"
|
||||
>
|
||||
<div class="upload-image-content" :style="props.style">
|
||||
<template v-if="myValue">
|
||||
<template v-if="imageUrl">
|
||||
<!-- <div class="upload-image"
|
||||
:style="{
|
||||
backgroundSize: props.backgroundSize,
|
||||
backgroundImage: `url(${imageUrl})`
|
||||
}"
|
||||
></div> -->
|
||||
<img :src="myValue" class="upload-image" />
|
||||
<img :src="imageUrl" class="upload-image" />
|
||||
<div class="upload-image-mask">点击修改</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
@ -32,7 +32,7 @@
|
|||
</div>
|
||||
</a-upload>
|
||||
<div class="upload-loading-mask" v-if="props.disabled"></div>
|
||||
<div class="upload-loading-mask" v-if="myValue && loading">
|
||||
<div class="upload-loading-mask" v-if="imageUrl && loading">
|
||||
<AIcon type="LoadingOutlined" style="font-size: 20px" />
|
||||
</div>
|
||||
</div>
|
||||
|
@ -56,7 +56,6 @@ interface JUploadProps extends UploadProps {
|
|||
errorMessage?: string;
|
||||
size?: number;
|
||||
style?: CSSProperties;
|
||||
backgroundSize?: string;
|
||||
}
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
@ -76,24 +75,23 @@ const loading = ref<boolean>(false)
|
|||
const imageUrl = ref<string>(props?.modelValue || '')
|
||||
const imageTypes = props.types ? props.types : ['image/jpeg', 'image/png'];
|
||||
|
||||
const myValue = computed({
|
||||
get: () => {
|
||||
return props.modelValue;
|
||||
},
|
||||
set: (val: any) => {
|
||||
imageUrl.value = val;
|
||||
emit('update:modelValue', val);
|
||||
},
|
||||
});
|
||||
watch(() => props.modelValue,
|
||||
(newValue)=> {
|
||||
console.log(newValue)
|
||||
imageUrl.value = newValue
|
||||
}, {
|
||||
deep: true,
|
||||
immediate: true
|
||||
})
|
||||
|
||||
const handleChange = (info: UploadChangeParam) => {
|
||||
if (info.file.status === 'uploading') {
|
||||
loading.value = true;
|
||||
}
|
||||
if (info.file.status === 'done') {
|
||||
myValue.value = info.file.response?.result
|
||||
imageUrl.value = info.file.response?.result
|
||||
loading.value = false;
|
||||
emit('update:modelValue', imageUrl.value)
|
||||
emit('update:modelValue', info.file.response?.result)
|
||||
}
|
||||
if (info.file.status === 'error') {
|
||||
loading.value = false;
|
||||
|
|
|
@ -68,12 +68,14 @@ export default [
|
|||
|
||||
// 设备管理
|
||||
{
|
||||
path: '/device/Instance',
|
||||
path: '/device/instance',
|
||||
component: () => import('@/views/device/Instance/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/device/Instance/detail/:id',
|
||||
component: () => import('@/views/device/Instance/detail.vue')
|
||||
// path: '/device/Instance/detail/:id',
|
||||
// component: () => import('@/views/device/Instance/detail.vue')
|
||||
path: '/device/instance/detail/:id',
|
||||
component: () => import('@/views/device/Instance/Detail/index.vue')
|
||||
},
|
||||
// link 运维管理
|
||||
{
|
||||
|
@ -117,6 +119,14 @@ export default [
|
|||
path:'/system/Permission',
|
||||
component: ()=>import('@/views/system/Permission/index.vue')
|
||||
},
|
||||
{
|
||||
path:'/system/Menu',
|
||||
component: ()=>import('@/views/system/Menu/index.vue')
|
||||
},
|
||||
{
|
||||
path:'/system/Menu/detail/:id',
|
||||
component: ()=>import('@/views/system/Menu/Detail/index.vue')
|
||||
},
|
||||
// 初始化
|
||||
{
|
||||
path: '/init-home',
|
||||
|
|
|
@ -1,13 +1,28 @@
|
|||
import { DeviceInstance, InstanceModel } from "@/views/device/Instance/typings"
|
||||
import { defineStore } from "pinia";
|
||||
import { defineStore } from "pinia"
|
||||
import { detail } from '@/api/device/instance'
|
||||
|
||||
export const useInstanceStore = defineStore({
|
||||
id: 'device',
|
||||
state: () => ({} as InstanceModel),
|
||||
state: () => ({
|
||||
current: {} as Partial<DeviceInstance>,
|
||||
detail: {} as Partial<DeviceInstance>,
|
||||
tabActiveKey: 'Info'
|
||||
}),
|
||||
actions: {
|
||||
setCurrent(current: Partial<DeviceInstance>) {
|
||||
this.current = current
|
||||
this.detail = current
|
||||
}
|
||||
},
|
||||
async refresh(id: string) {
|
||||
const resp = await detail(id)
|
||||
if(resp.status === 200){
|
||||
this.current = resp.result
|
||||
this.detail = resp.result
|
||||
}
|
||||
},
|
||||
setTabActiveKey(key: string) {
|
||||
this.tabActiveKey = key
|
||||
},
|
||||
}
|
||||
})
|
|
@ -76,30 +76,3 @@ export function getSlotVNode<T>(slots: Slots, props: Record<string, unknown>, pr
|
|||
}
|
||||
return (props[prop] || slots[prop]?.()) as T;
|
||||
}
|
||||
|
||||
/**
|
||||
* 时间转换为'2022-01-02 14:03:05'
|
||||
* @param date 时间对象
|
||||
* @returns
|
||||
*/
|
||||
export const dateFormat = (dateSouce:any):string|Error => {
|
||||
let date = null
|
||||
try {
|
||||
date = new Date(dateSouce)
|
||||
} catch (error) {
|
||||
return new Error('请传入日期格式数据')
|
||||
}
|
||||
let year = date.getFullYear();
|
||||
let month: number | string = date.getMonth() + 1;
|
||||
let day: number | string = date.getDate();
|
||||
let hour: number | string = date.getHours();
|
||||
let minutes: number | string = date.getMinutes();
|
||||
let seconds: number | string = date.getSeconds();
|
||||
month = (month < 10) ? '0' + month : month;
|
||||
day = (day < 10) ? '0' + day : day;
|
||||
hour = (hour < 10) ? '0' + hour : hour;
|
||||
minutes = (minutes < 10) ? '0' + minutes : minutes;
|
||||
seconds = (seconds < 10) ? '0' + seconds : seconds;
|
||||
return year + "-" + month + "-" + day
|
||||
+ " " + hour + ":" + minutes + ":" + seconds;
|
||||
}
|
||||
|
|
|
@ -54,6 +54,17 @@ export const downloadObject = (record: Record<string, any>, fileName: string, fo
|
|||
formElement.submit();
|
||||
document.body.removeChild(formElement);
|
||||
};
|
||||
|
||||
export const downloadFileByUrl = (url: string, name: string, type: string) => {
|
||||
const downNode = document.createElement('a');
|
||||
downNode.style.display = 'none';
|
||||
downNode.download = `${name}.${type}`;
|
||||
downNode.href = url;
|
||||
document.body.appendChild(downNode);
|
||||
downNode.click();
|
||||
document.body.removeChild(downNode);
|
||||
};
|
||||
|
||||
// 是否不是community版本
|
||||
export const isNoCommunity = !(localStorage.getItem(SystemConst.VERSION_CODE) === 'community');
|
||||
|
||||
|
|
|
@ -0,0 +1,57 @@
|
|||
<template>
|
||||
<div style="margin-top: 20px" v-if="config.length">
|
||||
<div style="display: flex;">
|
||||
<div style="font-size: 16px; font-weight: 700">配置</div>
|
||||
<a-space>
|
||||
<a-button type="link" @click="visible = true"><AIcon type="EditOutlined" />编辑</a-button>
|
||||
<a-button type="link" v-if="instanceStore.detail.current?.value !== 'notActive'"><AIcon type="CheckOutlined" />应用配置<a-tooltip title="修改配置后需重新应用后才能生效。"><AIcon type="QuestionCircleOutlined" /></a-tooltip></a-button>
|
||||
<a-button type="link" v-if="instanceStore.detail.aloneConfiguration"><AIcon type="SyncOutlined" />恢复默认<a-tooltip title="该设备单独编辑过配置信息,点击此将恢复成默认的配置信息,请谨慎操作。"><AIcon type="QuestionCircleOutlined" /></a-tooltip></a-button>
|
||||
</a-space>
|
||||
</div>
|
||||
<a-descriptions bordered size="small" v-for="i in config" :key="i.name">
|
||||
<template #title><h4>{{i.name}}</h4></template>
|
||||
<a-descriptions-item v-for="item in i.properties" :key="item.property">
|
||||
<template #label>
|
||||
<a-tooltip v-if="item.description" :title="item.description"><AIcon type="QuestionCircleOutlined" /></a-tooltip>
|
||||
<span>{{item.name}}</span>
|
||||
</template>
|
||||
<span v-if="item.type.type === 'password' && instanceStore.current?.configuration?.[item.property]?.length > 0">******</span>
|
||||
<span v-else>
|
||||
<span>{{ instanceStore.current?.configuration?.[item.property] || '' }}</span>
|
||||
<a-tooltip v-if="isExit(item.property)" :title="`有效值:${instanceStore.current?.configuration?.[item.property]}`"><AIcon type="QuestionCircleOutlined" /></a-tooltip>
|
||||
</span>
|
||||
</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useInstanceStore } from "@/store/instance"
|
||||
import { ConfigMetadata } from "@/views/device/Product/typings"
|
||||
import { getConfigMetadata } from '@/api/device/instance'
|
||||
|
||||
const instanceStore = useInstanceStore()
|
||||
const visible = ref<boolean>(false)
|
||||
const config = ref<ConfigMetadata[]>([])
|
||||
|
||||
watchEffect(() => {
|
||||
if(instanceStore.current.id){
|
||||
// getConfigMetadata(instanceStore.current.id).then(resp => {
|
||||
// if(resp.status === 200){
|
||||
// config.value = resp?.result as ConfigMetadata[]
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
|
||||
const isExit = (property: string) => {
|
||||
return (
|
||||
instanceStore.current?.cachedConfiguration &&
|
||||
instanceStore.current?.cachedConfiguration[property] !== undefined &&
|
||||
instanceStore.current?.configuration &&
|
||||
instanceStore.current?.configuration[property] !==
|
||||
instanceStore.current?.cachedConfiguration[property]
|
||||
);
|
||||
}
|
||||
|
||||
</script>
|
|
@ -0,0 +1,23 @@
|
|||
<template>
|
||||
<div style="margin-top: 20px">
|
||||
<a-descriptions bordered>
|
||||
<template #title>
|
||||
关系信息
|
||||
<a-button type="link" @click="visible = true"><AIcon type="EditOutlined" />编辑<a-tooltip title="管理设备与其他业务的关联关系,关系来源于关系配置"><AIcon type="QuestionCircleOutlined" /></a-tooltip></a-button>
|
||||
</template>
|
||||
<a-descriptions-item :span="1" v-for="item in dataSource" :key="item.objectId" :label="item.relationName">{{ item?.related ? (item?.related || []).map(i => i.name).join(',') : '' }}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useInstanceStore } from "@/store/instance"
|
||||
const instanceStore = useInstanceStore()
|
||||
|
||||
const dataSource = ref<Record<any, any>[]>([])
|
||||
|
||||
watchEffect(() => {
|
||||
const arr = (instanceStore.current?.relations || []).reverse()
|
||||
dataSource.value = arr as Record<any, any>[]
|
||||
})
|
||||
</script>
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
tags
|
||||
</template>
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<a-card>
|
||||
<a-descriptions bordered>
|
||||
<template #title>
|
||||
设备信息
|
||||
<a-button type="link" @click="visible = true"><AIcon type="EditOutlined" />编辑</a-button>
|
||||
</template>
|
||||
<a-descriptions-item label="设备ID">{{ instanceStore.current.id }}</a-descriptions-item>
|
||||
<a-descriptions-item label="产品名称">{{ instanceStore.current.productName }}</a-descriptions-item>
|
||||
<a-descriptions-item label="产品分类">{{ instanceStore.current.classifiedName }}</a-descriptions-item>
|
||||
<a-descriptions-item label="设备类型">{{ instanceStore.current.deviceType?.text }}</a-descriptions-item>
|
||||
<a-descriptions-item label="固件版本">{{ instanceStore.current.firmwareInfo?.version }}</a-descriptions-item>
|
||||
<a-descriptions-item label="连接协议">{{ instanceStore.current.protocolName }}</a-descriptions-item>
|
||||
<a-descriptions-item label="消息协议">{{ instanceStore.current.transport }}</a-descriptions-item>
|
||||
<a-descriptions-item label="创建时间">{{ instanceStore.current.createTime ? moment(instanceStore.current.createTime).format('YYYY-MM-DD HH:mm:ss') : '' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="注册时间">{{ instanceStore.current.registerTime ? moment(instanceStore.current.registerTime).format('YYYY-MM-DD HH:mm:ss') : ''}}</a-descriptions-item>
|
||||
<a-descriptions-item label="最后上线时间">{{ instanceStore.current.onlineTime ? moment(instanceStore.current.onlineTime).format('YYYY-MM-DD HH:mm:ss') : '' }}</a-descriptions-item>
|
||||
<a-descriptions-item label="父设备" v-if="instanceStore.current.deviceType?.value === 'childrenDevice'">{{ instanceStore.current.parentId }}</a-descriptions-item>
|
||||
<a-descriptions-item label="说明">{{ instanceStore.current.description }}</a-descriptions-item>
|
||||
</a-descriptions>
|
||||
<Config />
|
||||
<Tags v-if="instanceStore.current?.tags && instanceStore.current?.tags.length > 0 " />
|
||||
<Relation v-if="instanceStore.current?.relations && instanceStore.current?.relations.length > 0" />
|
||||
<Save v-if="visible" :data="instanceStore.current" @close="visible = false" @save="saveBtn" />
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useInstanceStore } from '@/store/instance'
|
||||
import Save from '../../Save/index.vue'
|
||||
import Config from './components/Config/index.vue'
|
||||
import Tags from './components/Tags/index.vue'
|
||||
import Relation from './components/Relation/index.vue'
|
||||
import moment from 'moment'
|
||||
|
||||
const visible = ref<boolean>(false)
|
||||
const instanceStore = useInstanceStore()
|
||||
|
||||
const saveBtn = () => {
|
||||
if(instanceStore.current?.id){
|
||||
instanceStore.refresh(instanceStore.current?.id)
|
||||
}
|
||||
visible.value = false
|
||||
}
|
||||
</script>
|
|
@ -0,0 +1,49 @@
|
|||
<template>
|
||||
<page-container :tabList="list" @back="onBack" :tabActiveKey="instanceStore.active" @tabChange="onTabChange">
|
||||
<template #subTitle><div>{{instanceStore.current.name}}</div></template>
|
||||
<component :is="instanceStore.tabActiveKey" />
|
||||
</page-container>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useInstanceStore } from '@/store/instance';
|
||||
import Info from './Info/index.vue';
|
||||
import Metadata from '../../components/Metadata/index.vue';
|
||||
const route = useRoute();
|
||||
const instanceStore = useInstanceStore()
|
||||
|
||||
const list = [
|
||||
{
|
||||
key: 'Info',
|
||||
tab: '实例信息'
|
||||
},
|
||||
{
|
||||
key: 'Metadata',
|
||||
tab: '物模型'
|
||||
}
|
||||
]
|
||||
|
||||
const tabs = {
|
||||
Info,
|
||||
Metadata
|
||||
}
|
||||
|
||||
watch(
|
||||
() => route.params.id,
|
||||
(newId) => {
|
||||
if(newId){
|
||||
instanceStore.tabActiveKey = 'Info'
|
||||
instanceStore.refresh(newId as string)
|
||||
}
|
||||
},
|
||||
{immediate: true, deep: true}
|
||||
);
|
||||
|
||||
const onBack = () => {
|
||||
|
||||
}
|
||||
|
||||
const onTabChange = (e: string) => {
|
||||
instanceStore.tabActiveKey = e
|
||||
}
|
||||
</script>
|
|
@ -1,29 +1,83 @@
|
|||
<template>
|
||||
<a-modal :maskClosable="false" width="650px" :visible="true" title="新增" @ok="handleCancel" @cancel="handleCancel">
|
||||
<a-modal
|
||||
:maskClosable="false"
|
||||
width="650px"
|
||||
:visible="true"
|
||||
:title="!!props.data.id ? '编辑' : '新增'"
|
||||
@ok="handleSave"
|
||||
@cancel="handleCancel"
|
||||
:confirmLoading="loading"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<a-form :layout="'vertical'">
|
||||
<a-form
|
||||
:layout="'vertical'"
|
||||
ref="formRef"
|
||||
:rules="rules"
|
||||
:model="modelRef"
|
||||
>
|
||||
<a-row type="flex">
|
||||
<a-col flex="180px">
|
||||
<a-form-item required name="photoUrl">
|
||||
<JUpload v-model:value="modelRef.photoUrl" />
|
||||
<a-form-item name="photoUrl">
|
||||
<JUpload v-model="modelRef.photoUrl" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col flex="auto">
|
||||
<a-form-item label="ID">
|
||||
<a-input v-model:value="modelRef.id" placeholder="请输入ID" />
|
||||
<a-form-item name="id">
|
||||
<template #label>
|
||||
<span>
|
||||
ID
|
||||
<a-tooltip title="若不填写,系统将自动生成唯一ID">
|
||||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
style="margin-left: 2px;" />
|
||||
</a-tooltip>
|
||||
</span>
|
||||
</template>
|
||||
<a-input
|
||||
v-model:value="modelRef.id"
|
||||
placeholder="请输入ID"
|
||||
:disabled="!!props.data.id"
|
||||
/>
|
||||
</a-form-item>
|
||||
<a-form-item label="名称" required>
|
||||
<a-input v-model:value="modelRef.name" placeholder="请输入名称" />
|
||||
<a-form-item label="名称" name="name">
|
||||
<a-input
|
||||
v-model:value="modelRef.name"
|
||||
placeholder="请输入名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-form-item label="产品" required>
|
||||
<a-select showSearch v-model:value="modelRef.productId" placeholder="请选择产品">
|
||||
<a-select-option :value="item.id" v-for="item in productList" :key="item.id" :title="item.name"></a-select-option>
|
||||
<a-form-item name="productId">
|
||||
<template #label>
|
||||
<span>所属产品
|
||||
<a-tooltip title="只能选择“正常”状态的产品">
|
||||
<AIcon
|
||||
type="QuestionCircleOutlined"
|
||||
style="margin-left: 2px" />
|
||||
</a-tooltip>
|
||||
</span>
|
||||
</template>
|
||||
<a-select
|
||||
showSearch
|
||||
v-model:value="modelRef.productId"
|
||||
placeholder="请选择所属产品"
|
||||
>
|
||||
<a-select-option
|
||||
:value="item.id"
|
||||
v-for="item in productList"
|
||||
:key="item.id"
|
||||
:title="item.name"
|
||||
:disabled="!!props.data.id"
|
||||
></a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="说明">
|
||||
<a-textarea v-model:value="modelRef.describe" placeholder="请输入说明" />
|
||||
<a-form-item label="说明" name="describe">
|
||||
<a-textarea
|
||||
v-model:value="modelRef.describe"
|
||||
placeholder="请输入说明"
|
||||
showCount
|
||||
:maxlength="200"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</div>
|
||||
|
@ -31,41 +85,130 @@
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { queryNoPagingPost } from '@/api/device/product'
|
||||
import { queryNoPagingPost } from '@/api/device/product';
|
||||
import { isExists, update } from '@/api/device/instance';
|
||||
import { getImage } from '@/utils/comm';
|
||||
import { Form } from 'ant-design-vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const emit = defineEmits(['close', 'save'])
|
||||
const emit = defineEmits(['close', 'save']);
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: undefined
|
||||
}
|
||||
})
|
||||
const productList = ref<Record<string, any>[]>([])
|
||||
const useForm = Form.useForm;
|
||||
default: undefined,
|
||||
},
|
||||
});
|
||||
const productList = ref<Record<string, any>[]>([]);
|
||||
const loading = ref<boolean>(false);
|
||||
|
||||
const formRef = ref();
|
||||
|
||||
const modelRef = reactive({
|
||||
productId: undefined,
|
||||
id: '',
|
||||
name: '',
|
||||
describe: '',
|
||||
photoUrl: getImage('/device/instance/device-card.png')
|
||||
photoUrl: getImage('/device/instance/device-card.png'),
|
||||
});
|
||||
|
||||
const vailId = async (_: Record<string, any>, value: string) => {
|
||||
if (!props?.data?.id && value) {
|
||||
const resp = await isExists(value);
|
||||
if (resp.status === 200 && resp.result) {
|
||||
return Promise.reject('ID重复');
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
};
|
||||
|
||||
const rules = {
|
||||
name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入名称',
|
||||
},
|
||||
{
|
||||
max: 64,
|
||||
message: '最多输入64个字符',
|
||||
},
|
||||
],
|
||||
photoUrl: [
|
||||
{
|
||||
required: true,
|
||||
message: '请上传图标',
|
||||
},
|
||||
],
|
||||
productId: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择所属产品',
|
||||
},
|
||||
],
|
||||
id: [
|
||||
{
|
||||
max: 64,
|
||||
message: '最多输入64个字符',
|
||||
},
|
||||
{
|
||||
pattern: /^[a-zA-Z0-9_\-]+$/,
|
||||
message: '请输入英文或者数字或者-或者_',
|
||||
},
|
||||
{
|
||||
validator: vailId,
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
() => {
|
||||
queryNoPagingPost({paging: false}).then(resp => {
|
||||
if(resp.status === 200){
|
||||
productList.value = resp.result as Record<string, any>[]
|
||||
(newValue) => {
|
||||
queryNoPagingPost({
|
||||
paging: false,
|
||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||
terms: [
|
||||
{
|
||||
terms: [
|
||||
{
|
||||
termType: 'eq',
|
||||
column: 'state',
|
||||
value: 1,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}).then((resp) => {
|
||||
if (resp.status === 200) {
|
||||
productList.value = resp.result as Record<string, any>[];
|
||||
}
|
||||
})
|
||||
});
|
||||
Object.assign(modelRef, newValue);
|
||||
},
|
||||
{immediate: true, deep: true}
|
||||
)
|
||||
{ immediate: true, deep: true },
|
||||
);
|
||||
|
||||
const handleCancel = () => {
|
||||
emit('close')
|
||||
}
|
||||
emit('close');
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
|
||||
const handleSave = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(async () => {
|
||||
loading.value = true;
|
||||
const resp = await update(toRaw(modelRef));
|
||||
loading.value = false;
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功!');
|
||||
emit('save');
|
||||
formRef.value.resetFields();
|
||||
}
|
||||
})
|
||||
.catch((err: any) => {
|
||||
console.log('error', err);
|
||||
});
|
||||
};
|
||||
</script>
|
|
@ -250,6 +250,7 @@ import Process from './Process/index.vue';
|
|||
import Save from './Save/index.vue';
|
||||
import { BASE_API_PATH, TOKEN_KEY } from '@/utils/variable';
|
||||
|
||||
const router = useRouter();
|
||||
const instanceRef = ref<Record<string, any>>({});
|
||||
const params = ref<Record<string, any>>({});
|
||||
const _selectedRowKeys = ref<string[]>([]);
|
||||
|
@ -364,8 +365,8 @@ const handleAdd = () => {
|
|||
* 查看
|
||||
*/
|
||||
const handleView = (id: string) => {
|
||||
message.warn(id + '暂未开发');
|
||||
};
|
||||
router.push('/device/instance/detail/' + id)
|
||||
}
|
||||
|
||||
const getActions = (
|
||||
data: Partial<Record<string, any>>,
|
||||
|
@ -516,5 +517,10 @@ const disabledSelectedDevice = async () => {
|
|||
_selectedRowKeys.value = [];
|
||||
instanceRef.value?.reload();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const saveBtn = () => {
|
||||
visible.value = false
|
||||
instanceRef.value?.reload()
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -22,7 +22,9 @@
|
|||
}"
|
||||
>
|
||||
<template #modifyTime="slotProps">
|
||||
<span>{{ dateFormat(slotProps.modifyTime) }}</span>
|
||||
<span>{{
|
||||
moment(slotProps.modifyTime).format('HHHH-MM-DD HH:mm:ss')
|
||||
}}</span>
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<StatusLabel
|
||||
|
@ -46,8 +48,8 @@ import StatusLabel from '../StatusLabel.vue';
|
|||
|
||||
import { ComponentInternalInstance } from 'vue';
|
||||
import { getDeviceList_api } from '@/api/home';
|
||||
import { dateFormat } from '@/utils/comm';
|
||||
import { message } from 'ant-design-vue';
|
||||
import moment from 'moment';
|
||||
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
const emits = defineEmits(['confirm']);
|
||||
|
|
|
@ -0,0 +1,155 @@
|
|||
<!-- 绑定设备 -->
|
||||
<template>
|
||||
<a-modal
|
||||
:maskClosable="false"
|
||||
width="1100px"
|
||||
:visible="true"
|
||||
title="选择设备"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
:confirmLoading="btnLoading"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<Search
|
||||
:columns="columns"
|
||||
target="iot-card-management-search"
|
||||
@search="handleSearch"
|
||||
/>
|
||||
<JTable
|
||||
ref="bindDeviceRef"
|
||||
:columns="columns"
|
||||
:request="queryUnbounded"
|
||||
:defaultParams="{
|
||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||
}"
|
||||
:rowSelection="{
|
||||
type: 'radio',
|
||||
selectedRowKeys: _selectedRowKeys,
|
||||
onSelect: onSelectChange,
|
||||
}"
|
||||
@cancelSelect="cancelSelect"
|
||||
:params="params"
|
||||
>
|
||||
<template #registryTime="slotProps">
|
||||
{{
|
||||
slotProps.registryTime
|
||||
? moment(slotProps.registryTime).format(
|
||||
'YYYY-MM-DD HH:mm:ss',
|
||||
)
|
||||
: ''
|
||||
}}
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
:text="slotProps.state.text"
|
||||
:status="statusMap.get(slotProps.state.value)"
|
||||
/>
|
||||
</template>
|
||||
</JTable>
|
||||
</div>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { queryUnbounded, bind } from '@/api/iot-card/cardManagement';
|
||||
import moment from 'moment';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const emit = defineEmits(['change']);
|
||||
|
||||
const props = defineProps({
|
||||
cardId: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
|
||||
const bindDeviceRef = ref<Record<string, any>>({});
|
||||
const params = ref<Record<string, any>>({});
|
||||
const _selectedRowKeys = ref<string[]>([]);
|
||||
const btnLoading = ref<boolean>(false);
|
||||
|
||||
const statusMap = new Map();
|
||||
statusMap.set('online', 'processing');
|
||||
statusMap.set('offline', 'error');
|
||||
statusMap.set('notActive', 'warning');
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
ellipsis: true,
|
||||
fixed: 'left',
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '设备名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '注册时间',
|
||||
dataIndex: 'registryTime',
|
||||
key: 'registryTime',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'date',
|
||||
},
|
||||
// sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
key: 'state',
|
||||
scopedSlots: true,
|
||||
search: {
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: '禁用', value: 'notActive' },
|
||||
{ label: '离线', value: 'offline' },
|
||||
{ label: '在线', value: 'online' },
|
||||
],
|
||||
},
|
||||
// filterMultiple: false,
|
||||
},
|
||||
];
|
||||
|
||||
const handleSearch = (params: any) => {
|
||||
console.log(params);
|
||||
params.value = params;
|
||||
};
|
||||
|
||||
const onSelectChange = (record: any) => {
|
||||
_selectedRowKeys.value = [record.id];
|
||||
};
|
||||
|
||||
const cancelSelect = () => {
|
||||
_selectedRowKeys.value = [];
|
||||
};
|
||||
|
||||
const handleOk = () => {
|
||||
btnLoading.value = true;
|
||||
bind(props.cardId, _selectedRowKeys.value[0])
|
||||
.then((resp: any) => {
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功');
|
||||
emit('change', true);
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
btnLoading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
emit('change', false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
|
@ -0,0 +1,65 @@
|
|||
<template>
|
||||
<!-- 导入 -->
|
||||
<a-modal
|
||||
:maskClosable="false"
|
||||
:visible="true"
|
||||
title="导出"
|
||||
@ok="handleOk"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<a-space>
|
||||
<span>文件格式:</span>
|
||||
<a-radio-group
|
||||
v-model:value="type"
|
||||
placeholder="请选择文件格式"
|
||||
button-style="solid"
|
||||
>
|
||||
<a-radio-button value="xlsx">xlsx</a-radio-button>
|
||||
<a-radio-button value="csv">csv</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-space>
|
||||
</div>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import moment from 'moment';
|
||||
import { _export } from '@/api/iot-card/cardManagement';
|
||||
import { downloadFileByUrl } from '@/utils/utils';
|
||||
|
||||
const emit = defineEmits(['close']);
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: undefined,
|
||||
},
|
||||
});
|
||||
|
||||
const type = ref<string>('xlsx');
|
||||
|
||||
const handleOk = () => {
|
||||
console.log(props.data);
|
||||
_export(type.value, props.data).then((res: any) => {
|
||||
if (res) {
|
||||
const blob = new Blob([res.data], { type: type.value });
|
||||
const url = URL.createObjectURL(blob);
|
||||
downloadFileByUrl(
|
||||
url,
|
||||
`物联卡管理-${moment(new Date()).format(
|
||||
'YYYY/MM/DD HH:mm:ss',
|
||||
)}`,
|
||||
type.value,
|
||||
);
|
||||
emit('close');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
emit('close');
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="less"></style>
|
|
@ -0,0 +1,157 @@
|
|||
<template>
|
||||
<!-- 导入 -->
|
||||
<a-modal
|
||||
:maskClosable="false"
|
||||
:visible="true"
|
||||
title="导入"
|
||||
@ok="handleCancel"
|
||||
@cancel="handleCancel"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<a-form :layout="'vertical'">
|
||||
<a-form-item label="平台对接" required>
|
||||
<a-select
|
||||
showSearch
|
||||
v-model:value="modelRef.configId"
|
||||
:options="configList"
|
||||
placeholder="请选择平台对接"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item v-if="modelRef.configId" label="文件格式">
|
||||
<a-radio-group
|
||||
button-style="solid"
|
||||
v-model:value="modelRef.fileType"
|
||||
placeholder="请选择文件格式"
|
||||
>
|
||||
<a-radio-button value="xlsx">xlsx</a-radio-button>
|
||||
<a-radio-button value="csv">csv</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="文件上传" v-if="modelRef.configId">
|
||||
<a-upload
|
||||
v-model:fileList="modelRef.upload"
|
||||
name="file"
|
||||
:action="FILE_UPLOAD"
|
||||
:headers="{
|
||||
'X-Access-Token': LocalStore.get(TOKEN_KEY),
|
||||
}"
|
||||
:accept="`.${modelRef.fileType || 'xlsx'}`"
|
||||
:showUploadList="false"
|
||||
@change="fileChange"
|
||||
>
|
||||
<a-button :loading="loading">
|
||||
<template #icon>
|
||||
<AIcon type="UploadOutlined" />
|
||||
</template>
|
||||
文件上传
|
||||
</a-button>
|
||||
</a-upload>
|
||||
</a-form-item>
|
||||
<a-form-item v-if="modelRef.configId" label="下载模板">
|
||||
<a-space>
|
||||
<a-button icon="file" @click="downFileFn('xlsx')">
|
||||
.xlsx
|
||||
</a-button>
|
||||
<a-button icon="file" @click="downFileFn('csv')">
|
||||
.csv
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-form-item>
|
||||
<div v-if="totalCount">
|
||||
<a-icon class="check-num" type="check" /> 已完成 总数量
|
||||
<span class="check-num">{{ totalCount }}</span>
|
||||
</div>
|
||||
<div v-if="errCount">
|
||||
<a-icon class="check-num" style="color: red" type="close" />
|
||||
失败 总数量
|
||||
<span class="check-num">{{ errCount }}</span>
|
||||
</div>
|
||||
</a-form>
|
||||
</div>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { FILE_UPLOAD } from '@/api/comm';
|
||||
import { BASE_API_PATH, TOKEN_KEY } from '@/utils/variable';
|
||||
import { LocalStore } from '@/utils/comm';
|
||||
import { downloadFile } from '@/utils/utils';
|
||||
import { queryPlatformNoPage, _import } from '@/api/iot-card/cardManagement';
|
||||
import { message } from 'ant-design-vue';
|
||||
|
||||
const emit = defineEmits(['close']);
|
||||
|
||||
const configList = ref<Record<string, any>[]>([]);
|
||||
const loading = ref<boolean>(false);
|
||||
const totalCount = ref<number>(0);
|
||||
const errCount = ref<number>(0);
|
||||
|
||||
const modelRef = reactive({
|
||||
configId: undefined,
|
||||
upload: [],
|
||||
fileType: 'xlsx',
|
||||
});
|
||||
|
||||
const getConfig = async () => {
|
||||
const resp: any = await queryPlatformNoPage({
|
||||
paging: false,
|
||||
terms: [
|
||||
{
|
||||
terms: [
|
||||
{
|
||||
column: 'state',
|
||||
termType: 'eq',
|
||||
value: 'enabled',
|
||||
type: 'and',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
configList.value = resp.result.map((item: any) => {
|
||||
return { key: item.id, label: item.name, value: item.id };
|
||||
});
|
||||
};
|
||||
|
||||
const fileChange = (info: any) => {
|
||||
loading.value = true;
|
||||
if (info.file.status === 'done') {
|
||||
const r = info.file.response || { result: '' };
|
||||
_import(modelRef.configId, { fileUrl: r.result })
|
||||
.then((resp: any) => {
|
||||
totalCount.value = resp.result.total;
|
||||
message.success('导入成功');
|
||||
})
|
||||
.catch((err) => {
|
||||
message.error(err.response.data.message || '导入失败');
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const downFileFn = (type: string) => {
|
||||
const url = `${BASE_API_PATH}/network/card/template.${type}`;
|
||||
downloadFile(url);
|
||||
};
|
||||
|
||||
const handleCancel = () => {
|
||||
totalCount.value = 0;
|
||||
errCount.value = 0;
|
||||
modelRef.configId = undefined;
|
||||
emit('close', true);
|
||||
};
|
||||
|
||||
getConfig();
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.check-num {
|
||||
margin: 6px;
|
||||
color: @primary-color;
|
||||
}
|
||||
</style>
|
|
@ -103,6 +103,113 @@
|
|||
</a-dropdown>
|
||||
</a-space>
|
||||
</template>
|
||||
<template #card="slotProps">
|
||||
<CardBox
|
||||
:value="slotProps"
|
||||
@click="handleClick"
|
||||
:actions="getActions(slotProps, 'card')"
|
||||
v-bind="slotProps"
|
||||
:active="_selectedRowKeys.includes(slotProps.id)"
|
||||
:status="slotProps.cardStateType.value"
|
||||
:statusText="slotProps.cardStateType.text"
|
||||
:statusNames="{
|
||||
using: 'success',
|
||||
toBeActivated: 'default',
|
||||
deactivate: 'error',
|
||||
}"
|
||||
>
|
||||
<template #img>
|
||||
<slot name="img">
|
||||
<img :src="getImage('/iot-card/iot-card-bg.png')" />
|
||||
</slot>
|
||||
</template>
|
||||
<template #content>
|
||||
<h3
|
||||
class="card-item-content-title"
|
||||
@click.stop="handleView(slotProps.id)"
|
||||
>
|
||||
{{ slotProps.id }}
|
||||
</h3>
|
||||
<a-row>
|
||||
<a-col :span="8">
|
||||
<div class="card-item-content-text">
|
||||
平台对接
|
||||
</div>
|
||||
<div>{{ slotProps.platformConfigName }}</div>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<div class="card-item-content-text">类型</div>
|
||||
<div>{{ slotProps.cardType.text }}</div>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<div class="card-item-content-text">提醒</div>
|
||||
<!-- <div>{{ slotProps.cardType.text }}</div> -->
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-divider style="margin: 12px 0" />
|
||||
<div v-if="slotProps.usedFlow === 0">
|
||||
<span class="flow-text">
|
||||
{{ slotProps.totalFlow }}
|
||||
</span>
|
||||
<span class="card-item-content-text"> M 使用流量</span>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="progress-text">
|
||||
<div>{{ slotProps.totalFlow - slotProps.usedFlow }} %</div>
|
||||
<div class="card-item-content-text">
|
||||
总共 {{ slotProps.totalFlow }} M
|
||||
</div>
|
||||
</div>
|
||||
<a-progress
|
||||
:strokeColor="'#ADC6FF'"
|
||||
:showInfo="false"
|
||||
:percent="slotProps.totalFlow - slotProps.usedFlow"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
<a-tooltip
|
||||
v-bind="item.tooltip"
|
||||
:title="item.disabled && item.tooltip.title"
|
||||
>
|
||||
<a-popconfirm
|
||||
v-if="item.popConfirm"
|
||||
v-bind="item.popConfirm"
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
<a-button :disabled="item.disabled">
|
||||
<AIcon
|
||||
type="DeleteOutlined"
|
||||
v-if="item.key === 'delete'"
|
||||
/>
|
||||
<template v-else>
|
||||
<AIcon :type="item.icon" />
|
||||
<span>{{ item.text }}</span>
|
||||
</template>
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
<template v-else>
|
||||
<a-button
|
||||
:disabled="item.disabled"
|
||||
@click="item.onClick"
|
||||
>
|
||||
<AIcon
|
||||
type="DeleteOutlined"
|
||||
v-if="item.key === 'delete'"
|
||||
/>
|
||||
<template v-else>
|
||||
<AIcon :type="item.icon" />
|
||||
<span>{{ item.text }}</span>
|
||||
</template>
|
||||
</a-button>
|
||||
</template>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
</CardBox>
|
||||
</template>
|
||||
<template #deviceId="slotProps">
|
||||
{{ slotProps.deviceName }}
|
||||
</template>
|
||||
<template #totalFlow="slotProps">
|
||||
<div>
|
||||
{{
|
||||
|
@ -157,7 +264,7 @@
|
|||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip
|
||||
v-for="i in getActions(slotProps)"
|
||||
v-for="i in getActions(slotProps, 'table')"
|
||||
:key="i.key"
|
||||
v-bind="i.tooltip"
|
||||
>
|
||||
|
@ -186,6 +293,20 @@
|
|||
</a-space>
|
||||
</template>
|
||||
</JTable>
|
||||
<!-- 批量导入 -->
|
||||
<Import v-if="importVisible" @close="importVisible = false" />
|
||||
<!-- 批量导出 -->
|
||||
<Export
|
||||
v-if="exportVisible"
|
||||
@close="exportVisible = false"
|
||||
:data="_selectedRowKeys"
|
||||
/>
|
||||
<!-- 绑定设备 -->
|
||||
<BindDevice
|
||||
v-if="bindDeviceVisible"
|
||||
:cardId="cardId"
|
||||
@change="bindDevice"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -204,16 +325,25 @@ import {
|
|||
resumptionBatch,
|
||||
sync,
|
||||
removeCards,
|
||||
unbind,
|
||||
} from '@/api/iot-card/cardManagement';
|
||||
import { message } from 'ant-design-vue';
|
||||
import type { CardManagement } from './typing';
|
||||
import { getImage } from '@/utils/comm';
|
||||
import BindDevice from './BindDevice.vue';
|
||||
import Import from './Import.vue';
|
||||
import Export from './Export.vue';
|
||||
|
||||
const cardManageRef = ref<Record<string, any>>({});
|
||||
const params = ref<Record<string, any>>({});
|
||||
const _selectedRowKeys = ref<string[]>([]);
|
||||
const _selectedRow = ref<any[]>([]);
|
||||
const bindDeviceVisible = ref<boolean>(false);
|
||||
const visible = ref<boolean>(false);
|
||||
const exportVisible = ref<boolean>(false);
|
||||
const importVisible = ref<boolean>(false);
|
||||
const cardId = ref<any>();
|
||||
const current = ref<Partial<CardManagement>>({});
|
||||
|
||||
const columns = [
|
||||
{
|
||||
|
@ -239,9 +369,10 @@ const columns = [
|
|||
},
|
||||
{
|
||||
title: '绑定设备',
|
||||
dataIndex: 'deviceName',
|
||||
key: 'deviceName',
|
||||
dataIndex: 'deviceId',
|
||||
key: 'deviceId',
|
||||
ellipsis: true,
|
||||
scopedSlots: true,
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
|
@ -360,7 +491,10 @@ const columns = [
|
|||
},
|
||||
];
|
||||
|
||||
const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
||||
const getActions = (
|
||||
data: Partial<Record<string, any>>,
|
||||
type: 'card' | 'table',
|
||||
): ActionsType[] => {
|
||||
if (!data) return [];
|
||||
return [
|
||||
{
|
||||
|
@ -386,6 +520,25 @@ const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
|||
title: data.deviceId ? '解绑设备' : '绑定设备',
|
||||
},
|
||||
icon: data.deviceId ? 'DisconnectOutlined' : 'LinkOutlined',
|
||||
popConfirm: data.deviceId
|
||||
? {
|
||||
title: '确认解绑设备?',
|
||||
onConfirm: async () => {
|
||||
unbind(data.id).then((resp: any) => {
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功');
|
||||
cardManageRef.value?.reload();
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
: undefined,
|
||||
onClick: () => {
|
||||
if (!data.deviceId) {
|
||||
bindDeviceVisible.value = true;
|
||||
cardId.value = data.id;
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'activation',
|
||||
|
@ -479,11 +632,38 @@ const cancelSelect = () => {
|
|||
_selectedRowKeys.value = [];
|
||||
};
|
||||
|
||||
const handleClick = (dt: any) => {
|
||||
if (_selectedRowKeys.value.includes(dt.id)) {
|
||||
const _index = _selectedRowKeys.value.findIndex((i) => i === dt.id);
|
||||
_selectedRowKeys.value.splice(_index, 1);
|
||||
} else {
|
||||
_selectedRowKeys.value = [..._selectedRowKeys.value, dt.id];
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 查看
|
||||
*/
|
||||
const handleView = (id: string) => {
|
||||
message.warn(id + '暂未开发');
|
||||
};
|
||||
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
const handleAdd = () => {};
|
||||
|
||||
/**
|
||||
* 绑定设备关闭窗口
|
||||
*/
|
||||
const bindDevice = (val: boolean) => {
|
||||
bindDeviceVisible.value = false;
|
||||
cardId.value = '';
|
||||
if (val) {
|
||||
cardManageRef.value?.reload();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 批量激活
|
||||
*/
|
||||
|
@ -565,7 +745,25 @@ const handelRemove = async () => {
|
|||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.search {
|
||||
width: calc(100% - 330px);
|
||||
.page-container {
|
||||
.search {
|
||||
width: calc(100% - 330px);
|
||||
}
|
||||
.flow-text {
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.progress-text {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
:deep(.ant-progress-inner) {
|
||||
border-radius: 0px;
|
||||
}
|
||||
:deep(.ant-progress-bg) {
|
||||
border-radius: 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
export type CardManagement = {
|
||||
id: string;
|
||||
name: string;
|
||||
iccId: string;
|
||||
deviceId: string;
|
||||
deviceName: string;
|
||||
platformConfigId: string;
|
||||
operatorName: string;
|
||||
cardType: any;
|
||||
totalFlow: number;
|
||||
usedFlow: number;
|
||||
residualFlow: number;
|
||||
activationDate: string;
|
||||
updateTime: string;
|
||||
cardStateType: any;
|
||||
cardState: any;
|
||||
describe: string;
|
||||
platformConfigName: string;
|
||||
operatorPlatformType: any;
|
||||
};
|
|
@ -0,0 +1,333 @@
|
|||
<template>
|
||||
<div class="basic-info-container">
|
||||
<a-card>
|
||||
<h3>基本信息</h3>
|
||||
<a-form :model="form.data" class="basic-form">
|
||||
<div class="row" style="display: flex">
|
||||
<a-form-item
|
||||
label="菜单图标"
|
||||
name="icon"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请上传图标',
|
||||
},
|
||||
]"
|
||||
style="flex: 0 0 186px"
|
||||
>
|
||||
<div class="icon-upload has-icon" v-if="form.data.icon">
|
||||
<svg aria-hidden="true">
|
||||
<use :xlinkHref="`#${form.data.icon}`" />
|
||||
</svg>
|
||||
<span class="mark">点击修改</span>
|
||||
</div>
|
||||
|
||||
<div v-else class="icon-upload no-icon">
|
||||
<span>
|
||||
<plus-outlined style="font-size: 30px" />
|
||||
<p>点击选择图标</p>
|
||||
</span>
|
||||
</div>
|
||||
</a-form-item>
|
||||
<a-row :gutter="24" style="flex: 1 1 auto">
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
label="名称"
|
||||
name="name"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入名称' },
|
||||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input v-model:value="form.data.name" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
label="编码"
|
||||
name="code"
|
||||
:rules="[
|
||||
{ required: true, message: '请输入编码' },
|
||||
{ max: 64, message: '最多可输入64个字符' },
|
||||
]"
|
||||
>
|
||||
<a-input v-model:value="form.data.code" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
label="页面地址"
|
||||
name="url"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '请输入页面地址',
|
||||
},
|
||||
{ max: 128, message: '最多可输入128字符' },
|
||||
]"
|
||||
>
|
||||
<a-input v-model:value="form.data.url" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<a-form-item
|
||||
label="排序"
|
||||
name="sortIndex"
|
||||
:rules="[
|
||||
{
|
||||
pattern: /^[0-9]*[1-9][0-9]*$/,
|
||||
message: '请输入大于0的整数',
|
||||
},
|
||||
]"
|
||||
>
|
||||
<a-input v-model:value="form.data.sortIndex" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
<a-form-item label="说明" name="describe">
|
||||
<a-textarea
|
||||
v-model:value="form.data.describe"
|
||||
:rows="4"
|
||||
placeholder="请输入说明"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-card>
|
||||
<a-card>
|
||||
<h3>权限配置</h3>
|
||||
<a-form :model="form.data" class="basic-form permiss-form">
|
||||
<a-form-item name="accessSupport" required>
|
||||
<template #label>
|
||||
<span style="margin-right: 3px">数据权限控制</span>
|
||||
<a-tooltip title="此菜单页面数据所对应的资产类型">
|
||||
<question-circle-outlined
|
||||
class="img-style"
|
||||
style="color: #a6a6a6"
|
||||
/>
|
||||
</a-tooltip>
|
||||
</template>
|
||||
<a-radio-group
|
||||
v-model:value="form.data.accessSupport"
|
||||
name="radioGroup"
|
||||
>
|
||||
<a-radio value="unsupported">不支持</a-radio>
|
||||
<a-radio value="support">支持</a-radio>
|
||||
<a-radio value="indirect">
|
||||
<span style="margin-right: 3px">间接控制</span>
|
||||
<a-tooltip
|
||||
title="此菜单内的数据基于其他菜单的数据权限控制"
|
||||
>
|
||||
<question-circle-filled class="img-style" />
|
||||
</a-tooltip>
|
||||
</a-radio>
|
||||
</a-radio-group>
|
||||
|
||||
<a-form-item
|
||||
name="assetType"
|
||||
v-if="form.data.accessSupport === 'support'"
|
||||
:rules="[{ required: true, message: '请选择资产类型' }]"
|
||||
style="margin-top: 24px; margin-bottom: 0"
|
||||
>
|
||||
<a-select
|
||||
v-model:value="form.data.assetType"
|
||||
style="width: 500px"
|
||||
placeholder="请选择资产类型"
|
||||
>
|
||||
<a-select-option
|
||||
v-for="item in form.assetsType"
|
||||
:value="item.value"
|
||||
>{{ item.label }}</a-select-option
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item
|
||||
name="indirectMenus"
|
||||
v-if="form.data.accessSupport === 'indirect'"
|
||||
:rules="[{ required: true, message: '请选择关联菜单' }]"
|
||||
style="margin-top: 24px; margin-bottom: 0"
|
||||
>
|
||||
<a-tree-select
|
||||
v-model:value="form.data.indirectMenus"
|
||||
style="width: 400px"
|
||||
:dropdown-style="{
|
||||
maxHeight: '400px',
|
||||
overflow: 'auto',
|
||||
}"
|
||||
placeholder="请选择关联菜单"
|
||||
multiple
|
||||
show-search
|
||||
tree-default-expand-all
|
||||
:tree-data="form.treeData"
|
||||
>
|
||||
<template #title="{ value: val, title }">
|
||||
<b
|
||||
v-if="val === 'parent 1-1'"
|
||||
style="color: #08c"
|
||||
>{{ val }}</b
|
||||
>
|
||||
<template v-else>{{ title }}</template>
|
||||
</template>
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
</a-form-item>
|
||||
<a-form-item label="权限">
|
||||
<a-input
|
||||
v-model:value="form.data.permissions"
|
||||
style="width: 300px"
|
||||
allowClear
|
||||
placeholder="请输入权限名称"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
|
||||
<a-button type="primary" @click="clickSave">保存</a-button>
|
||||
</a-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
PlusOutlined,
|
||||
QuestionCircleFilled,
|
||||
QuestionCircleOutlined,
|
||||
} from '@ant-design/icons-vue';
|
||||
import {
|
||||
getMenuTree_api,
|
||||
getAssetsType_api,
|
||||
getMenuDetail_api,
|
||||
} from '@/api/system/menu';
|
||||
import { exportPermission_api } from '@/api/system/permission';
|
||||
|
||||
const route = useRoute();
|
||||
const routeParams = {
|
||||
id: route.params.id === ':id' ? '' : (route.params.id as string),
|
||||
...route.query,
|
||||
url: route.query.basePath,
|
||||
};
|
||||
|
||||
const form = reactive({
|
||||
data: {
|
||||
name: '',
|
||||
code: '',
|
||||
sortIndex: '',
|
||||
icon: '',
|
||||
describe: '',
|
||||
permissions: '',
|
||||
accessSupport: '',
|
||||
assetType: undefined,
|
||||
indirectMenus: [],
|
||||
...routeParams,
|
||||
} as formType,
|
||||
|
||||
treeData: [], // 关联菜单
|
||||
assetsType: [] as assetType[], // 资产类型
|
||||
premissonList: [], // 权限列表
|
||||
|
||||
init: () => {
|
||||
// 获取菜单详情
|
||||
routeParams.id &&
|
||||
getMenuDetail_api(routeParams.id).then((resp) => {
|
||||
console.log('菜单详情', resp);
|
||||
});
|
||||
// 获取权限列表
|
||||
// exportPermission_api()
|
||||
// 获取关联菜单
|
||||
getMenuTree_api({ paging: false }).then((resp) => {
|
||||
console.log('关联菜单', resp);
|
||||
});
|
||||
// 获取资产类型
|
||||
getAssetsType_api().then((resp:any) => {
|
||||
form.assetsType = resp.result.map((item:any)=>({label:item.name,value:item.id}))
|
||||
});
|
||||
},
|
||||
});
|
||||
form.init();
|
||||
const clickSave = () => {};
|
||||
|
||||
type formType = {
|
||||
name: string;
|
||||
code: string;
|
||||
url: string;
|
||||
sortIndex: string;
|
||||
icon: string;
|
||||
permissions: string;
|
||||
describe: string;
|
||||
accessSupport: string;
|
||||
assetType: string | undefined;
|
||||
indirectMenus: any[];
|
||||
};
|
||||
|
||||
type assetType = {
|
||||
label: string;
|
||||
value: string;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.basic-info-container {
|
||||
.ant-card {
|
||||
margin-bottom: 24px;
|
||||
|
||||
h3 {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
padding: 4px 0 4px 12px;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: 5px px;
|
||||
left: 0;
|
||||
width: 4px;
|
||||
height: calc(100% - 10px);
|
||||
background-color: #1d39c4;
|
||||
border-radius: 2px;
|
||||
content: ' ';
|
||||
}
|
||||
}
|
||||
|
||||
.basic-form {
|
||||
.ant-form-item {
|
||||
display: block;
|
||||
:deep(.ant-form-item-label) {
|
||||
overflow: inherit;
|
||||
.img-style {
|
||||
cursor: help;
|
||||
}
|
||||
label::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
:deep(.ant-form-item-control-input-content) {
|
||||
.icon-upload {
|
||||
width: 160px;
|
||||
height: 150px;
|
||||
border: 1px dashed #d9d9d9;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: 0.5s;
|
||||
&:hover {
|
||||
border-color: #415ed1;
|
||||
}
|
||||
}
|
||||
.has-icon {
|
||||
}
|
||||
.no-icon {
|
||||
background-color: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,18 @@
|
|||
<template>
|
||||
<div class="button-mange-container">
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
||||
const route = useRoute();
|
||||
const routeParams = {
|
||||
id: route.params.id === ':id' ? '' : route.params.id,
|
||||
...route.query,
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
|
@ -0,0 +1,25 @@
|
|||
<template>
|
||||
<div class="menu-detail-container">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="basic" tab="基本信息"> <BasicInfo /> </a-tab-pane>
|
||||
<a-tab-pane key="button" tab="按钮管理">
|
||||
<ButtonMange />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import BasicInfo from './BasicInfo.vue';
|
||||
import ButtonMange from './ButtonMange.vue';
|
||||
const activeKey = ref('basic');
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.menu-detail-container {
|
||||
.ant-tabs-tabpane {
|
||||
background-color: #f0f2f5;
|
||||
padding: 24px;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -0,0 +1,247 @@
|
|||
<template>
|
||||
<div class="menu-container">
|
||||
<Search :columns="query.columns" @search="query.search" />
|
||||
|
||||
<JTable
|
||||
ref="tableRef"
|
||||
:columns="table.columns"
|
||||
:request="table.getList"
|
||||
model="TABLE"
|
||||
:params="query.params"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="table.toDetails({})"
|
||||
style="margin-right: 10px"
|
||||
><plus-outlined />新增</a-button
|
||||
>
|
||||
<a-button>菜单实例</a-button>
|
||||
</template>
|
||||
<template #createTime="slotProps">
|
||||
{{ slotProps.createTime }}
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip>
|
||||
<template #title>查看</template>
|
||||
<a-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
@click="table.toDetails(slotProps)"
|
||||
>
|
||||
<edit-outlined />
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
<a-tooltip>
|
||||
<template #title>新增子菜单</template>
|
||||
<a-button
|
||||
style="padding: 0"
|
||||
type="link"
|
||||
@click="table.toDetails(slotProps)"
|
||||
>
|
||||
<edit-outlined />
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
|
||||
<a-popconfirm
|
||||
title="是否删除该菜单"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="table.clickDel(slotProps)"
|
||||
:disabled="slotProps.status"
|
||||
>
|
||||
<a-tooltip>
|
||||
<template #title>删除</template>
|
||||
<a-button style="padding: 0" type="link">
|
||||
<delete-outlined />
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-popconfirm>
|
||||
</a-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { getMenuTree_api } from '@/api/system/menu';
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// 筛选
|
||||
const query = reactive({
|
||||
columns: [
|
||||
{
|
||||
title: '编码',
|
||||
dataIndex: 'code',
|
||||
key: 'code',
|
||||
ellipsis: true,
|
||||
fixed: 'left',
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '页面地址',
|
||||
dataIndex: 'url',
|
||||
key: 'url',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'string',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sortIndex',
|
||||
key: 'sortIndex',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'number',
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
key: 'createTime',
|
||||
ellipsis: true,
|
||||
search: {
|
||||
type: 'date',
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {
|
||||
terms: [],
|
||||
},
|
||||
search: (params: any) => {
|
||||
query.params = params;
|
||||
},
|
||||
});
|
||||
|
||||
const tableRef = ref<Record<string, any>>({}); // 表格实例
|
||||
const table = reactive({
|
||||
columns: [
|
||||
{
|
||||
title: '编码',
|
||||
dataIndex: 'code',
|
||||
key: 'code',
|
||||
width: 300,
|
||||
},
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: 220,
|
||||
},
|
||||
{
|
||||
title: '页面地址',
|
||||
dataIndex: 'url',
|
||||
key: 'url',
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sortIndex',
|
||||
key: 'sortIndex',
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: '说明',
|
||||
dataIndex: 'describe',
|
||||
key: 'describe',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
key: 'createTime',
|
||||
scopedSlots: true,
|
||||
width: 180,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
key: 'action',
|
||||
scopedSlots: true,
|
||||
width: 140,
|
||||
},
|
||||
],
|
||||
tableData: [],
|
||||
total: 0,
|
||||
getList: async (_params: any) => {
|
||||
//过滤非集成的菜单
|
||||
const item = {
|
||||
terms: [
|
||||
{
|
||||
terms: [
|
||||
{
|
||||
column: 'owner',
|
||||
termType: 'eq',
|
||||
value: 'iot',
|
||||
},
|
||||
{
|
||||
column: 'owner',
|
||||
termType: 'isnull',
|
||||
value: '1',
|
||||
type: 'or',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
const params = {
|
||||
..._params,
|
||||
terms:
|
||||
_params.terms && _params.length !== 0
|
||||
? [...query.params.terms, item]
|
||||
: [item],
|
||||
sorts: [{ name: 'sortIndex', order: 'asc' }],
|
||||
paging: false,
|
||||
};
|
||||
const resp: any = await getMenuTree_api(params);
|
||||
const lastItem = resp.result[resp.result.length - 1];
|
||||
table.total == lastItem ? lastItem.sortIndex + 1 : 1;
|
||||
return {
|
||||
code: resp.message,
|
||||
result: {
|
||||
data: resp.result,
|
||||
pageIndex: 0,
|
||||
pageSize: 0,
|
||||
total: 0,
|
||||
},
|
||||
status: resp.status,
|
||||
};
|
||||
},
|
||||
// 跳转至详情页
|
||||
toDetails: (row: any) => {
|
||||
router.push(
|
||||
`/system/Menu/detail/${row.id || ':id'}?pid=${
|
||||
row.pid || ''
|
||||
}&basePath=${row.basePath || ''}&sortIndex=${table.total + 1}`,
|
||||
);
|
||||
},
|
||||
// 删除
|
||||
clickDel: (row: any) => {
|
||||
// delPermission_api(row.id).then((resp: any) => {
|
||||
// if (resp.status === 200) {
|
||||
// tableRef.value?.reload();
|
||||
// message.success('操作成功!');
|
||||
// }
|
||||
// });
|
||||
},
|
||||
// 刷新列表
|
||||
refresh: () => {
|
||||
tableRef.value.reload();
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
Loading…
Reference in New Issue