@@ -123,29 +128,53 @@
v-model="createDialogVisible"
:title="dialogMode === 'create' ? '新增数据大屏' : '编辑数据大屏'"
width="600px"
+ draggable
>
-
-
+
+
-
-
-
-
-
+
+
-
-
+
+
-
-
+
+
+
+
+
+
+
+
+
+
取 消
@@ -169,20 +208,27 @@
import { getStrDictOptions, DICT_TYPE } from '@/utils/dict'
import request from '@/config/axios'
import defaultImage from '@/assets/imgs/logo.png'
+import { OrganizationApi } from '@/api/mes/organization'
+import { handleTree } from '@/utils/tree'
+import { DeviceApi } from '@/api/iot/device'
defineOptions({ name: 'DashboardList' })
-const { push } = useRouter()
+const router = useRouter()
const message = useMessage()
interface DashboardItem {
id: number
name: string
remark: string
- state: string
+ state: number
indexImage?: string
route?: string
content?: string
+ type?: string
+ orgId?: number | string
+ orgName?: string
+ deviceIds?: string
}
const loading = ref(false)
@@ -207,12 +253,32 @@ const editingId = ref(null)
const createForm = reactive({
name: '',
remark: '',
- state: '',
+ state: 1,
+ type: '',
+ orgId: undefined as number | string | undefined,
+ orgName: '',
+ deviceIds: '',
indexImage: '',
route: '',
content: ''
})
+const createFormRules = reactive({
+ name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+ type: [{ required: true, message: '大屏类型不能为空', trigger: 'change' }],
+ orgId: [{ required: true, message: '产线不能为空', trigger: 'change' }]
+})
+
+const organizationTree = ref([])
+const lineTreeProps = {
+ label: 'name',
+ children: 'children',
+ value: 'id'
+}
+
+const deviceList = ref([])
+const selectedDeviceIds = ref([])
+
const getList = async () => {
loading.value = true
try {
@@ -238,21 +304,33 @@ const resetQuery = () => {
}
const handlePreview = (item: DashboardItem) => {
- if (!item.route) {
+ const typeRoute = getRouteByType(item.type)
+ const route = typeRoute || item.route || ''
+ if (!route) {
message.error('未配置预览路由')
return
}
- const path = item.route.startsWith('/') ? item.route : `/${item.route}`
- push(path)
+ const path = route.startsWith('/') ? route : `/${route}`
+ const queryParams = new URLSearchParams()
+ if (item.orgId) queryParams.append('orgId', String(item.orgId))
+ if (item.type === '1' && item.deviceIds) queryParams.append('deviceIds', item.deviceIds)
+ const queryString = queryParams.toString()
+ const url = router.resolve(path + (queryString ? `?${queryString}` : '')).href
+ window.open(url, '_blank')
}
const resetCreateForm = () => {
createForm.name = ''
createForm.remark = ''
- createForm.state = ''
+ createForm.state = 1
+ createForm.type = ''
+ createForm.orgId = undefined
+ createForm.orgName = ''
+ createForm.deviceIds = ''
createForm.indexImage = ''
createForm.route = ''
createForm.content = ''
+ selectedDeviceIds.value = []
}
const openCreateDialog = () => {
@@ -267,18 +345,55 @@ const openEditDialog = (item: DashboardItem) => {
editingId.value = item.id
createForm.name = item.name || ''
createForm.remark = item.remark || ''
- createForm.state = item.state || ''
+ createForm.state = item.state
+ createForm.type = item.type || ''
+ createForm.orgId = item.orgId || undefined
+ createForm.orgName = item.orgName || ''
+ createForm.deviceIds = item.deviceIds || ''
createForm.indexImage = item.indexImage || ''
createForm.route = item.route || ''
createForm.content = item.content || ''
+ selectedDeviceIds.value = createForm.deviceIds
+ ? createForm.deviceIds.split(',').filter((v) => v)
+ : []
createDialogVisible.value = true
}
+const getRouteByType = (type?: string) => {
+ if (type === '1') return 'iot/report/dashboardPage/Dashboard1'
+ if (type === '2') return 'iot/report/dashboardPage/Dashboard8'
+ return ''
+}
+
const submitDialog = async () => {
- if (!createForm.name) {
- message.error('名称不能为空')
+ try {
+ await createFormRef.value?.validate()
+ } catch {
return
}
+ if (createForm.type === '1') {
+ if (!selectedDeviceIds.value.length) {
+ message.error('设备不能为空')
+ return
+ }
+ if (selectedDeviceIds.value.length !== 8) {
+ message.error('设备必须选择8个')
+ return
+ }
+ createForm.deviceIds = selectedDeviceIds.value.join(',')
+ } else {
+ createForm.deviceIds = ''
+ }
+ if (createForm.orgId) {
+ const org = findOrgNode(organizationTree.value || [], createForm.orgId)
+ createForm.orgName = org?.name || ''
+ } else {
+ createForm.orgName = ''
+ }
+ const route = getRouteByType(createForm.type)
+ if (route) {
+ createForm.route = route
+ }
if (dialogMode.value === 'edit' && !editingId.value) {
message.error('缺少数据编号，无法编辑')
return
@@ -320,8 +435,38 @@ const handleDelete = async (item: DashboardItem) => {
} catch {}
}
+const loadOrganizationTree = async () => {
+ const data = await OrganizationApi.getOrganizationList()
+ organizationTree.value = handleTree(data, 'id', 'parentId')
+}
+
+const findOrgNode = (nodes: any[], id: any): any | undefined => {
+ for (const node of nodes) {
+ if (String(node.id) === String(id)) return node
+ const children = Array.isArray(node.children) ? node.children : []
+ const found = findOrgNode(children, id)
+ if (found) return found
+ }
+ return undefined
+}
+
+const handleOrgChange = () => {
+ if (!createForm.orgId) {
+ createForm.orgName = ''
+ return
+ }
+ const org = findOrgNode(organizationTree.value || [], createForm.orgId)
+ createForm.orgName = org?.name || ''
+}
+
+const loadDeviceList = async () => {
+ deviceList.value = await DeviceApi.getDeviceList()
+}
+
onMounted(() => {
getList()
+ loadOrganizationTree()
+ loadDeviceList()
})
diff --git a/src/views/report/dashboardPage/dashboard1/components/DeviceOverview.vue b/src/views/report/dashboardPage/dashboard1/components/DeviceOverview.vue
index f2fd3737..6c7bbb8e 100644
--- a/src/views/report/dashboardPage/dashboard1/components/DeviceOverview.vue
+++ b/src/views/report/dashboardPage/dashboard1/components/DeviceOverview.vue
@@ -19,6 +19,7 @@