Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev

# Conflicts:
#	src/router/menu.ts
This commit is contained in:
wangshuaiswim 2023-01-30 18:41:30 +08:00
commit cc07ccb19d
28 changed files with 1721 additions and 94 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

View File

@ -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`)

View File

@ -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 xlsxcsv
* @param params
*/
export const _export = (format: string, data: any) => server.post(`/network/card/download.${format}/_query`, data, 'blob');

View File

@ -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}`);

View File

@ -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 {

View File

@ -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;

View File

@ -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',

View File

@ -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
},
}
})

View File

@ -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;
}

View File

@ -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');

View File

@ -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>

View File

@ -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>

View File

@ -0,0 +1,3 @@
<template>
tags
</template>

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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']);

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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>

View File

@ -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;
};

View File

@ -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>

View File

@ -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>

View File

@ -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
src/views/system/Menu/index.d.ts vendored Normal file
View File

View File

@ -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>