Merge branch 'dev' of github.com:jetlinks/jetlinks-ui-vue into dev
This commit is contained in:
commit
ce02e2de1b
|
@ -1,6 +1,6 @@
|
|||
<!-- 绑定设备 -->
|
||||
<template>
|
||||
<a-modal
|
||||
<j-modal
|
||||
:maskClosable="false"
|
||||
width="1000px"
|
||||
:visible="true"
|
||||
|
@ -12,7 +12,7 @@
|
|||
:confirmLoading="btnLoading"
|
||||
>
|
||||
<div style="margin-top: 10px">
|
||||
<Search
|
||||
<pro-search
|
||||
:columns="columns"
|
||||
target="child-device-bind"
|
||||
@search="handleSearch"
|
||||
|
@ -73,14 +73,14 @@
|
|||
}}
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state.text"
|
||||
:status="statusMap.get(slotProps.state.value)"
|
||||
/>
|
||||
</template>
|
||||
</JProTable>
|
||||
</div>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<a-select allowClear v-model:value="_value" @change="onChange" placeholder="请选择" style="width: 100%">
|
||||
<a-select-option
|
||||
<j-select allowClear v-model:value="_value" @change="onChange" placeholder="请选择" style="width: 100%">
|
||||
<j-select-option
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
:value="item.id"
|
||||
:label="item.name"
|
||||
:filter-option="filterOption"
|
||||
>{{ item.name }}</a-select-option
|
||||
>{{ item.name }}</j-select-option
|
||||
>
|
||||
</a-select>
|
||||
</j-select>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<a-modal
|
||||
<j-modal
|
||||
width="900px"
|
||||
title="批量映射"
|
||||
visible
|
||||
|
@ -10,49 +10,49 @@
|
|||
<div class="map-tree-top">
|
||||
采集器的点位名称与属性名称一致时将自动映射绑定;有多个采集器点位名称与属性名称一致时以第1个采集器的点位数据进行绑定
|
||||
</div>
|
||||
<a-spin :spinning="loading">
|
||||
<j-spin :spinning="loading">
|
||||
<div class="map-tree-content">
|
||||
<a-card class="map-tree-content-card" title="源数据">
|
||||
<a-tree
|
||||
<j-card class="map-tree-content-card" title="源数据">
|
||||
<j-tree
|
||||
checkable
|
||||
:height="300"
|
||||
:tree-data="dataSource"
|
||||
:checkedKeys="checkedKeys"
|
||||
@check="onCheck"
|
||||
/>
|
||||
</a-card>
|
||||
</j-card>
|
||||
<div style="width: 100px">
|
||||
<a-button
|
||||
<j-button
|
||||
:disabled="rightList.length >= leftList.length"
|
||||
@click="onRight"
|
||||
>加入右侧</a-button
|
||||
>加入右侧</j-button
|
||||
>
|
||||
</div>
|
||||
<a-card class="map-tree-content-card" title="采集器">
|
||||
<a-list
|
||||
<j-card class="map-tree-content-card" title="采集器">
|
||||
<j-list
|
||||
size="small"
|
||||
:data-source="rightList"
|
||||
class="map-tree-content-card-list"
|
||||
>
|
||||
<template #renderItem="{ item }">
|
||||
<a-list-item>
|
||||
<j-list-item>
|
||||
{{ item.title }}
|
||||
<template #actions>
|
||||
<a-popconfirm
|
||||
<j-popconfirm
|
||||
title="确定删除?"
|
||||
@confirm="_delete(item.key)"
|
||||
>
|
||||
<AIcon type="DeleteOutlined" />
|
||||
</a-popconfirm>
|
||||
</j-popconfirm>
|
||||
</template>
|
||||
</a-list-item>
|
||||
</j-list-item>
|
||||
</template>
|
||||
</a-list>
|
||||
</a-card>
|
||||
</j-list>
|
||||
</j-card>
|
||||
</div>
|
||||
</a-spin>
|
||||
</j-spin>
|
||||
</div>
|
||||
</a-modal>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
@ -119,6 +119,7 @@ const onCheck = (keys: string[], e: any) => {
|
|||
};
|
||||
|
||||
const onRight = () => {
|
||||
console.log(rightList.value,leftList.value);
|
||||
rightList.value = leftList.value;
|
||||
};
|
||||
|
||||
|
|
|
@ -1,49 +1,51 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading" v-if="_metadata.length">
|
||||
<a-card :bordered="false">
|
||||
<j-spin :spinning="loading" v-if="_metadata.length">
|
||||
<j-card :bordered="false">
|
||||
<template #title>
|
||||
<TitleComponent data="点位映射"></TitleComponent>
|
||||
</template>
|
||||
<template #extra>
|
||||
<a-space>
|
||||
<a-button @click="showModal">批量映射</a-button>
|
||||
<a-button type="primary" @click="onSave">保存并应用</a-button>
|
||||
</a-space>
|
||||
<j-space>
|
||||
<j-button @click="showModal">批量映射</j-button>
|
||||
<j-button type="primary" @click="onSave"
|
||||
>保存并应用</j-button
|
||||
>
|
||||
</j-space>
|
||||
</template>
|
||||
<a-form ref="formRef" :model="modelRef">
|
||||
<a-table :dataSource="modelRef.dataSource" :columns="columns">
|
||||
<j-form ref="formRef" :model="modelRef">
|
||||
<j-table :dataSource="modelRef.dataSource" :columns="columns">
|
||||
<template #headerCell="{ column }">
|
||||
<template v-if="column.key === 'collectorId'">
|
||||
采集器
|
||||
<a-tooltip title="边缘网关代理的真实物理设备">
|
||||
<j-tooltip title="边缘网关代理的真实物理设备">
|
||||
<AIcon type="QuestionCircleOutlined" />
|
||||
</a-tooltip>
|
||||
</j-tooltip>
|
||||
</template>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record, index }">
|
||||
<template v-if="column.dataIndex === 'channelId'">
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="['dataSource', index, 'channelId']"
|
||||
>
|
||||
<a-select
|
||||
<j-select
|
||||
style="width: 100%"
|
||||
v-model:value="record[column.dataIndex]"
|
||||
placeholder="请选择"
|
||||
allowClear
|
||||
:filter-option="filterOption"
|
||||
>
|
||||
<a-select-option
|
||||
<j-select-option
|
||||
v-for="item in channelList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label"
|
||||
>{{ item.label }}</a-select-option
|
||||
>{{ item.label }}</j-select-option
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</j-select>
|
||||
</j-form-item>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'collectorId'">
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="['dataSource', index, 'collectorId']"
|
||||
:rules="[
|
||||
{
|
||||
|
@ -58,10 +60,10 @@
|
|||
type="COLLECTOR"
|
||||
:edgeId="instanceStore.current.id"
|
||||
/>
|
||||
</a-form-item>
|
||||
</j-form-item>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'pointId'">
|
||||
<a-form-item
|
||||
<j-form-item
|
||||
:name="['dataSource', index, 'pointId']"
|
||||
:rules="[
|
||||
{
|
||||
|
@ -76,33 +78,33 @@
|
|||
type="POINT"
|
||||
:edgeId="instanceStore.current.id"
|
||||
/>
|
||||
</a-form-item>
|
||||
</j-form-item>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'id'">
|
||||
<a-badge
|
||||
<j-badge
|
||||
v-if="record[column.dataIndex]"
|
||||
status="success"
|
||||
text="已绑定"
|
||||
/>
|
||||
<a-badge v-else status="error" text="未绑定" />
|
||||
<j-badge v-else status="error" text="未绑定" />
|
||||
</template>
|
||||
<template v-if="column.key === 'action'">
|
||||
<a-tooltip title="解绑">
|
||||
<a-popconfirm
|
||||
<j-tooltip title="解绑">
|
||||
<j-popconfirm
|
||||
title="确认解绑"
|
||||
:disabled="!record.id"
|
||||
@confirm="unbind(record.id)"
|
||||
>
|
||||
<a-button type="link" :disabled="!record.id"
|
||||
<j-button type="link" :disabled="!record.id"
|
||||
><AIcon type="icon-jiebang"
|
||||
/></a-button>
|
||||
</a-popconfirm>
|
||||
</a-tooltip>
|
||||
/></j-button>
|
||||
</j-popconfirm>
|
||||
</j-tooltip>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-form>
|
||||
</a-card>
|
||||
</j-table>
|
||||
</j-form>
|
||||
</j-card>
|
||||
<PatchMapping
|
||||
:deviceId="instanceStore.current.parentId"
|
||||
v-if="visible"
|
||||
|
@ -112,10 +114,10 @@
|
|||
:edgeId="instanceStore.current.id"
|
||||
:deviceData="deviceData"
|
||||
/>
|
||||
</a-spin>
|
||||
<a-card v-else>
|
||||
</j-spin>
|
||||
<j-card v-else>
|
||||
<JEmpty description="暂无数据,请配置物模型" style="margin: 10% 0" />
|
||||
</a-card>
|
||||
</j-card>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
@ -175,7 +177,7 @@ const filterOption = (input: string, option: any) => {
|
|||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
};
|
||||
const props = defineProps(['productList']);
|
||||
const _emit = defineEmits(['close']);
|
||||
const _emit = defineEmits(['close','getEdgeMap']);
|
||||
const instanceStore = useInstanceStore();
|
||||
let _metadata = ref();
|
||||
const loading = ref<boolean>(false);
|
||||
|
@ -187,7 +189,7 @@ const modelRef = reactive({
|
|||
const deviceData = ref();
|
||||
const formRef = ref();
|
||||
const visible = ref<boolean>(false);
|
||||
|
||||
/**获取通道列表 */
|
||||
const getChannel = async () => {
|
||||
if (instanceStore.current?.id) {
|
||||
const resp: any = await edgeChannel(instanceStore.current.id);
|
||||
|
@ -200,51 +202,31 @@ const getChannel = async () => {
|
|||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 初始化
|
||||
*/
|
||||
const handleSearch = async () => {
|
||||
loading.value = true;
|
||||
getChannel();
|
||||
modelRef.dataSource = _metadata.value;
|
||||
console.log(modelRef.dataSource);
|
||||
// if (_metadata.value && _metadata.value.length) {
|
||||
// console.log(1234);
|
||||
// const resp: any = await getEdgeMap(instanceStore.current?.orgId || '', {
|
||||
// deviceId: instanceStore.current.id,
|
||||
// query: {},
|
||||
// }).catch(() => {
|
||||
// modelRef.dataSource = _metadata;
|
||||
// loading.value = false;
|
||||
// });
|
||||
// if (resp.status === 200) {
|
||||
// const array = resp.result?.[0].reduce((x: any, y: any) => {
|
||||
// const metadataId = _metadata.find(
|
||||
// (item: any) => item.metadataId === y.metadataId,
|
||||
// );
|
||||
// if (metadataId) {
|
||||
// Object.assign(metadataId, y);
|
||||
// } else {
|
||||
// x.push(y);
|
||||
// }
|
||||
// return x;
|
||||
// }, _metadata);
|
||||
// modelRef.dataSource = array;
|
||||
// }
|
||||
// }
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* 解绑映射
|
||||
* @param id 选择解绑id
|
||||
*/
|
||||
const unbind = async (id: string) => {
|
||||
if (id) {
|
||||
const resp = await removeEdgeMap(
|
||||
instanceStore.current?.parentId || '',
|
||||
instanceStore.current?.id || '',
|
||||
{
|
||||
deviceId: instanceStore.current.id,
|
||||
deviceId: instanceStore.current.parentId,
|
||||
idList: [id],
|
||||
},
|
||||
);
|
||||
if (resp.status === 200) {
|
||||
message.success('操作成功!');
|
||||
handleSearch();
|
||||
_emit('getEdgeMap');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -280,8 +262,8 @@ const onSave = async () => {
|
|||
productName: props.productList.find(
|
||||
(item: any) => item.id === form.value?.productId,
|
||||
).name,
|
||||
parentId: instanceStore.current.id,
|
||||
id: instanceStore.current.parentId
|
||||
parentId: instanceStore.current.id, // 网关设备id
|
||||
id: instanceStore.current.parentId // 设备id
|
||||
? instanceStore.current.parentId
|
||||
: undefined,
|
||||
};
|
||||
|
@ -329,7 +311,4 @@ const showModal = async () => {
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-form-item) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
</style>
|
|
@ -2,7 +2,7 @@
|
|||
<div>
|
||||
<TitleComponent data="基本信息">
|
||||
<template #extra>
|
||||
<j-button @click="comeBack">返回</j-button>
|
||||
<j-button @click="comeBack" style="margin-left: 10px;">返回</j-button>
|
||||
</template>
|
||||
</TitleComponent>
|
||||
<j-form layout="vertical" :model="form" ref="formRef">
|
||||
|
@ -39,7 +39,10 @@
|
|||
</j-row>
|
||||
<j-row :gutter="24" v-if="visible">
|
||||
<j-col :span="24"
|
||||
><EdgeMap :productList="productList" @close="comeBack"
|
||||
><EdgeMap
|
||||
:productList="productList"
|
||||
@close="comeBack"
|
||||
@getEdgeMap="getEdgeMapData"
|
||||
/></j-col>
|
||||
</j-row>
|
||||
</j-form>
|
||||
|
@ -64,12 +67,22 @@ const formRef = ref();
|
|||
const emit = defineEmits(['closeChildSave']);
|
||||
const productList = ref();
|
||||
const visible = ref(false);
|
||||
/**
|
||||
* 获取产品列表
|
||||
*/
|
||||
const getProductList = async () => {
|
||||
const res = await getProductListNoPage({
|
||||
terms: [{ column: 'accessProvider', value: 'edge-child-device' }],
|
||||
});
|
||||
if (res.status === 200) {
|
||||
productList.value = res.result;
|
||||
getEdgeMapData();
|
||||
}
|
||||
};
|
||||
/**
|
||||
* 获取映射数据
|
||||
*/
|
||||
const getEdgeMapData = () => {
|
||||
if (props.childData?.id) {
|
||||
current.value.parentId = props.childData.id;
|
||||
form.name = props.childData?.name;
|
||||
|
@ -123,8 +136,11 @@ const getProductList = async () => {
|
|||
} else {
|
||||
current.value.parentId = '';
|
||||
}
|
||||
}
|
||||
};
|
||||
/**
|
||||
* 根据产品id获取对应映射列表
|
||||
* @param e 产品id
|
||||
*/
|
||||
const selectChange = (e: any) => {
|
||||
if (e) {
|
||||
visible.value = true;
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
<template>
|
||||
<a-card>
|
||||
<j-card>
|
||||
<SaveChild
|
||||
v-if="childVisible"
|
||||
@close-child-save="closeChildSave"
|
||||
:childData="_current"
|
||||
/>
|
||||
<div v-else>
|
||||
<Search
|
||||
<pro-search
|
||||
:columns="columns"
|
||||
target="child-device"
|
||||
@search="handleSearch"
|
||||
|
@ -76,7 +76,7 @@
|
|||
}}
|
||||
</template>
|
||||
<template #state="slotProps">
|
||||
<a-badge
|
||||
<j-badge
|
||||
:text="slotProps.state.text"
|
||||
:status="statusMap.get(slotProps.state.value)"
|
||||
/>
|
||||
|
@ -108,7 +108,7 @@
|
|||
</JProTable>
|
||||
<BindChildDevice v-if="visible" @change="closeBindDevice" />
|
||||
</div>
|
||||
</a-card>
|
||||
</j-card>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
|
|
@ -46,8 +46,9 @@
|
|||
total: dataSource.length,
|
||||
current: current,
|
||||
pageSize: pageSize,
|
||||
pageSizeOptions: ['12', '24', '48', '96'],
|
||||
pageSizeOptions: ['5', '10', '20', '50', '100'],
|
||||
showSizeChanger: true,
|
||||
hideOnSinglePage: true,
|
||||
showTotal: (total: number, range: number) => `第 ${range[0]} - ${range[1]} 条/总共 ${total} 条`,
|
||||
}"
|
||||
@change="handleTableChange"
|
||||
|
@ -384,7 +385,7 @@ const getTableData = () => {
|
|||
* 前端分页
|
||||
*/
|
||||
const current = ref(1);
|
||||
const pageSize = ref(12);
|
||||
const pageSize = ref(5);
|
||||
const handleTableChange = (pagination: any) => {
|
||||
current.value = pagination.current;
|
||||
pageSize.value = pagination.pageSize;
|
||||
|
|
|
@ -1012,7 +1012,10 @@ const { resetFields, validate, validateInfos, clearValidate } = useForm(
|
|||
watch(
|
||||
() => formData.value.template.markdown?.title,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1021,7 +1024,10 @@ watch(
|
|||
watch(
|
||||
() => formData.value.template.link?.title,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1030,7 +1036,10 @@ watch(
|
|||
watch(
|
||||
() => formData.value.template.subject,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1040,7 +1049,10 @@ watch(
|
|||
watch(
|
||||
() => formData.value.template.message,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1049,7 +1061,10 @@ watch(
|
|||
watch(
|
||||
() => formData.value.template.ttsmessage,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1058,7 +1073,10 @@ watch(
|
|||
watch(
|
||||
() => formData.value.template.body,
|
||||
(val) => {
|
||||
if (!val) return;
|
||||
if (!val) {
|
||||
formData.value.variableDefinitions = [];
|
||||
return;
|
||||
}
|
||||
variableReg();
|
||||
},
|
||||
{ deep: true },
|
||||
|
@ -1162,7 +1180,10 @@ const getConfigList = async () => {
|
|||
{ column: 'type$IN', value: formData.value.type },
|
||||
{ column: 'provider', value: formData.value.provider },
|
||||
];
|
||||
const { result } = await templateApi.getConfig({ terms });
|
||||
const { result } = await templateApi.getConfig({
|
||||
terms,
|
||||
sorts: [{ name: 'createTime', order: 'desc' }],
|
||||
});
|
||||
configList.value = result;
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in New Issue