From 59b6bafdf03464ad5d89a74623ec8941dec415c7 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 01 八月 2024 12:11:31 +0800
Subject: [PATCH] 2024.8.1
---
src/views/fysp/support/components/ItemConstruction.vue | 0
src/views/fysp/support/components/ItemScene.vue | 34 ++++
src/views/fysp/support/NewDevice.vue | 100 ++++++++++++++
src/components.d.ts | 1
src/views/fysp/support/JingAnSupport.vue | 77 +---------
src/api/additional-jingan/index.js | 3
src/views/fysp/support/NewConstruction.vue | 67 +++++++++
src/views/fysp/support/components/ItemDevice.vue | 63 +++++++++
src/components/search-option/base/FYOptionText.vue | 6
src/api/index.js | 2
src/api/fysp/deviceApi.js | 13 +
src/App.vue | 2
src/views/fysp/support/components/DeviceMatch.vue | 51 +++++++
13 files changed, 348 insertions(+), 71 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index e2f76b6..49d586d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -82,7 +82,7 @@
}
.el-main__content {
- padding: var(--el-main-padding);
+ padding: var(--el-main-padding) calc(var(--el-main-padding) / 2);
max-height: calc(100vh - 60px - var(--el-main-padding) * 2);
/* background-color: aqua; */
/* overflow: auto; */
diff --git a/src/api/additional-jingan/index.js b/src/api/additional-jingan/index.js
index 3922104..e1c9084 100644
--- a/src/api/additional-jingan/index.js
+++ b/src/api/additional-jingan/index.js
@@ -2,7 +2,8 @@
import md5 from 'md5';
import { ElMessage } from 'element-plus';
-let IP = 'http://101.230.224.80:8082/';
+// let IP = 'http://101.230.224.80:8082/';
+let IP = 'http://47.100.191.150:8080/jingan/';
const $jingan = axios.create({
baseURL: IP,
diff --git a/src/api/fysp/deviceApi.js b/src/api/fysp/deviceApi.js
new file mode 100644
index 0000000..f46d505
--- /dev/null
+++ b/src/api/fysp/deviceApi.js
@@ -0,0 +1,13 @@
+import { $fysp } from '../index';
+
+export default {
+ fetchDevice(sceneId) {
+ return $fysp
+ .get(`device`, {
+ params: {
+ sceneId: sceneId
+ }
+ })
+ .then((res) => res.data);
+ }
+};
diff --git a/src/api/index.js b/src/api/index.js
index 7dc7214..f8dbaf2 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -1,7 +1,7 @@
import axios from 'axios';
import { ElMessage } from 'element-plus';
-const debug = false;
+const debug = true;
let ip1 = 'http://47.100.191.150:9005/';
let ip1_file = 'http://47.100.191.150:9005/';
diff --git a/src/components.d.ts b/src/components.d.ts
index 8ac9bbb..c8c66a3 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow']
+ ElScorllbar: typeof import('element-plus/es')['ElScorllbar']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSpace: typeof import('element-plus/es')['ElSpace']
diff --git a/src/components/search-option/base/FYOptionText.vue b/src/components/search-option/base/FYOptionText.vue
index 980feb5..170e966 100644
--- a/src/components/search-option/base/FYOptionText.vue
+++ b/src/components/search-option/base/FYOptionText.vue
@@ -5,7 +5,7 @@
:model-value="value"
:placeholder="placeholder"
@input="handleInput"
- style="width: 150px"
+ :style="'width:' + width + ';'"
/>
</el-form-item>
</template>
@@ -13,6 +13,10 @@
<script>
export default {
props: {
+ width:{
+ type: String,
+ default: '150px'
+ },
label: {
type: String,
default: '鏌ヨ椤�'
diff --git a/src/views/fysp/support/JingAnSupport.vue b/src/views/fysp/support/JingAnSupport.vue
index ad2c9a4..1a0cc17 100644
--- a/src/views/fysp/support/JingAnSupport.vue
+++ b/src/views/fysp/support/JingAnSupport.vue
@@ -1,72 +1,15 @@
<template>
- <FYOptionTime :initValue="true" type="date" v-model:value="updateTime"></FYOptionTime>
- <el-button type="primary" @click="fetchNewDevice">鏌ヨ鏂拌澶�</el-button>
- <el-button type="primary" @click="fetchNewConstruction">鏌ヨ鏂板伐鍦�</el-button>
- <el-row>
- <el-col :span="12">
- <el-text>鏂拌澶�</el-text>
- <div v-for="item in deviceList" :key="item.id">
- <div>{{ item.id }}</div>
- <div>{{ item.code }}</div>
- <div>{{ item.name }}</div>
- <div>{{ item.address }}</div>
- <div>{{ item.status }}</div>
- <span>{{ item.createTime }} |</span>
- <span>{{ item.updateTime }} |</span>
- <span>{{ item.remark }} |</span>
- <span>{{ item.lon }} |</span>
- <span>{{ item.lat }}</span>
- </div>
- </el-col>
- <el-col :span="12">
- <el-text>鏂板伐鍦�</el-text>
- <div v-for="item in constructionList" :key="item.id">
- <div>{{ item.id }}</div>
- <div>{{ item.code }}</div>
- <div>{{ item.name }}</div>
- <div>{{ item.address }}</div>
- <div>{{ item.street }}</div>
- <div>{{ item.status }}</div>
- <span>{{ item.lon }} |</span>
- <span>{{ item.lat }}</span>
- <span>{{ item.score }} |</span>
- <span>{{ item.grade }}</span>
- <span>{{ item.subTaskId }} |</span>
- <span>{{ item.createTime }} |</span>
- </div>
- </el-col>
- </el-row>
+ <el-tabs type="border-card">
+ <el-tab-pane label="鏂拌澶�">
+ <NewDevice></NewDevice>
+ </el-tab-pane>
+ <el-tab-pane label="鏂板伐鍦�">
+ <NewConstruction></NewConstruction>
+ </el-tab-pane>
+ </el-tabs>
</template>
<script setup>
-import { ref } from 'vue';
-import dayjs from 'dayjs';
-import constructionApi from '@/api/additional-jingan/constructionApi';
-import { useFetchData } from '@/composables/fetchData';
-
-const { loading, fetchData } = useFetchData();
-
-const updateTime = ref();
-const deviceList = ref([]);
-const constructionList = ref([]);
-
-// 鏌ヨ闇�纭鐨勮澶囨竻鍗�
-function fetchNewDevice() {
- const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
- fetchData(() => {
- return constructionApi.queryDevice(param).then((res) => {
- deviceList.value = res.data;
- });
- });
-}
-
-// 鏌ヨ鏂板缓宸ュ湴
-function fetchNewConstruction() {
- const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
- fetchData(() => {
- return constructionApi.queryGdNew(param).then((res) => {
- constructionList.value = res.data;
- });
- });
-}
+import NewDevice from './NewDevice.vue';
+import NewConstruction from './NewConstruction.vue';
</script>
<style scoped></style>
diff --git a/src/views/fysp/support/NewConstruction.vue b/src/views/fysp/support/NewConstruction.vue
new file mode 100644
index 0000000..9d0c424
--- /dev/null
+++ b/src/views/fysp/support/NewConstruction.vue
@@ -0,0 +1,67 @@
+<template>
+ <el-form :inline="true">
+ <FYOptionTime :initValue="true" type="date" v-model:value="updateTime"></FYOptionTime>
+ <el-form-item>
+ <el-button type="primary" :loading="loading" @click="fetchNewConstruction"
+ >鏌ヨ鏂板伐鍦�</el-button
+ >
+ </el-form-item>
+ </el-form>
+ <el-row>
+ <el-col :span="12">
+ <el-text>鏂板伐鍦�</el-text>
+ <div v-for="item in constructionList" :key="item.id">
+ <div>{{ item.id }}</div>
+ <div>{{ item.code }}</div>
+ <div>{{ item.name }}</div>
+ <div>{{ item.address }}</div>
+ <div>{{ item.status }}</div>
+ <span>{{ item.createTime }} |</span>
+ <span>{{ item.updateTime }} |</span>
+ <span>{{ item.remark }} |</span>
+ <span>{{ item.lon }} |</span>
+ <span>{{ item.lat }}</span>
+ </div>
+ </el-col>
+ <el-col :span="12">
+ <el-text>鐩戠宸ュ湴</el-text>
+ <div v-for="item in sceneList" :key="item.id">
+ <div>{{ item.id }}</div>
+ <div>{{ item.code }}</div>
+ <div>{{ item.name }}</div>
+ <div>{{ item.address }}</div>
+ <div>{{ item.street }}</div>
+ <div>{{ item.status }}</div>
+ <span>{{ item.lon }} |</span>
+ <span>{{ item.lat }}</span>
+ <span>{{ item.score }} |</span>
+ <span>{{ item.grade }}</span>
+ <span>{{ item.subTaskId }} |</span>
+ <span>{{ item.createTime }} |</span>
+ </div>
+ </el-col>
+ </el-row>
+</template>
+<script setup>
+import { ref } from 'vue';
+import dayjs from 'dayjs';
+import constructionApi from '@/api/additional-jingan/constructionApi';
+import { useFetchData } from '@/composables/fetchData';
+
+const { loading, fetchData } = useFetchData();
+
+const updateTime = ref();
+const constructionList = ref([]);
+const sceneList = ref([])
+
+// 鏌ヨ鏂板缓宸ュ湴
+function fetchNewConstruction() {
+ const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
+ fetchData(() => {
+ return constructionApi.queryGdNew(param).then((res) => {
+ constructionList.value = res.data;
+ });
+ });
+}
+</script>
+<style scoped></style>
diff --git a/src/views/fysp/support/NewDevice.vue b/src/views/fysp/support/NewDevice.vue
new file mode 100644
index 0000000..e84c783
--- /dev/null
+++ b/src/views/fysp/support/NewDevice.vue
@@ -0,0 +1,100 @@
+<template>
+ <el-row>
+ <el-col :span="8">
+ <el-text>鏂拌澶�</el-text>
+ <el-form :inline="true">
+ <FYOptionTime :initValue="true" type="date" v-model:value="updateTime"></FYOptionTime>
+ <el-form-item>
+ <el-button type="primary" :loading="loading" @click="fetchNewDevice"
+ >鏌ヨ鏂拌澶�</el-button
+ >
+ </el-form-item>
+ </el-form>
+ <el-scrollbar height="76vh">
+ <el-space direction="vertical" alignment="normal">
+ <ItemDevice v-for="item in deviceList" :key="item.id" :item="item" @add="addDevice" />
+ </el-space>
+ </el-scrollbar>
+ </el-col>
+ <el-col :span="8">
+ <DeviceMatch :device="selectedDevice" :scene="selectedScene"></DeviceMatch>
+ </el-col>
+ <el-col :span="8">
+ <el-text>鐩戠宸ュ湴</el-text>
+ <el-form :inline="false">
+ <FYOptionText
+ label="鍦烘櫙鍚嶇О"
+ placeholder="杈撳叆鍚嶇О鍏抽敭瀛�"
+ width="400px"
+ v-model:value="searchText"
+ ></FYOptionText>
+ <el-form-item>
+ <el-button type="primary" :loading="loading2" @click="fetchScene">鏌ヨ鐩戠鍦烘櫙</el-button>
+ </el-form-item>
+ </el-form>
+ <el-scrollbar height="70vh">
+ <!-- <el-space direction="vertical" alignment="normal"> -->
+ <ItemScene v-for="item in sceneList" :key="item.sguid" :item="item" @add="addScene" />
+ <!-- </el-space> -->
+ </el-scrollbar>
+ </el-col>
+ </el-row>
+</template>
+<script setup>
+import { ref, computed } from 'vue';
+import dayjs from 'dayjs';
+import constructionApi from '@/api/additional-jingan/constructionApi';
+import sceneApi from '@/api/fysp/sceneApi';
+import { useFetchData } from '@/composables/fetchData';
+
+import ItemDevice from './components/ItemDevice.vue';
+import ItemScene from './components/ItemScene.vue';
+import DeviceMatch from './components/DeviceMatch.vue';
+
+const { loading, fetchData } = useFetchData();
+
+const updateTime = ref();
+const deviceList = ref([]);
+const selectedDevice = ref(null);
+
+const searchText = ref();
+const sceneList = ref([]);
+const selectedScene = ref(null);
+
+// 鏌ヨ闇�纭鐨勮澶囨竻鍗�
+function fetchNewDevice() {
+ const param = dayjs(updateTime.value).format('YYYY-MM-DD HH:mm:ss');
+ fetchData(() => {
+ return constructionApi.queryDevice(param).then((res) => {
+ deviceList.value = res.data;
+ });
+ });
+}
+
+function addDevice(item) {
+ selectedDevice.value = item;
+ searchText.value = item.name;
+ fetchScene();
+}
+
+const { loading: loading2, fetchData: fetchData2 } = useFetchData();
+// 鏌ヨ鐩戠鍦烘櫙
+function fetchScene() {
+ const area = {};
+ area.sceneName = searchText.value;
+ fetchData2((page, pageSize) => {
+ return sceneApi.searchScene(area, page, pageSize).then((res) => {
+ sceneList.value = res.data;
+ });
+ });
+}
+
+function addScene(item) {
+ selectedScene.value = item;
+}
+</script>
+<style scoped>
+.device-scene-wrap {
+ border: 1px solid black;
+}
+</style>
diff --git a/src/views/fysp/support/components/DeviceMatch.vue b/src/views/fysp/support/components/DeviceMatch.vue
new file mode 100644
index 0000000..338bbe7
--- /dev/null
+++ b/src/views/fysp/support/components/DeviceMatch.vue
@@ -0,0 +1,51 @@
+<template>
+ <el-card shadow="hover">
+ <div>鏂拌澶�</div>
+ <div v-if="device">{{ device.name }}</div>
+ <div v-else>鏈�夋嫨</div>
+ <el-divider></el-divider>
+ <div>鐩戠鍦烘櫙</div>
+ <div v-if="scene">{{ scene.name }}</div>
+ <div v-else>鏈�夋嫨</div>
+ <template #footer>
+ <el-row justify="space-between">
+ <div>
+ <!-- <el-button type="primary" plain :disabled="!enabled">鍚嶇О鍚屾</el-button> -->
+ <el-button type="primary" plain :disabled="!enabled">褰曞叆璁惧淇℃伅</el-button>
+ </div>
+ <el-button type="danger" :disabled="!enabled">涓婁紶鍖归厤淇℃伅</el-button>
+ </el-row>
+ <el-row></el-row>
+ </template>
+ </el-card>
+</template>
+<script setup>
+import { ref, computed, watch } from 'vue';
+import deviceApi from '@/api/fysp/deviceApi';
+
+const props = defineProps({
+ device: Object,
+ scene: Object
+});
+
+const deviceList = ref([]);
+
+const enabled = computed(() => {
+ return props.device && props.scene;
+});
+
+watch(
+ () => props.scene,
+ (nV, oV) => {
+ if (nV != oV) {
+ fetchDeviceInfo();
+ }
+ }
+);
+
+function fetchDeviceInfo() {
+ deviceApi.fetchDevice(props.scene.guid).then((res) => {
+ deviceList.value = res.data;
+ });
+}
+</script>
diff --git a/src/views/fysp/support/components/ItemConstruction.vue b/src/views/fysp/support/components/ItemConstruction.vue
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/views/fysp/support/components/ItemConstruction.vue
diff --git a/src/views/fysp/support/components/ItemDevice.vue b/src/views/fysp/support/components/ItemDevice.vue
new file mode 100644
index 0000000..e43440b
--- /dev/null
+++ b/src/views/fysp/support/components/ItemDevice.vue
@@ -0,0 +1,63 @@
+<template>
+ <el-card shadow="hover">
+ <!-- <template #header>
+ <div class="card-header">
+ <span>Card name</span>
+ </div>
+ </template> -->
+ <!-- <el-descriptions :column="3" size="default" border>
+ <el-descriptions-item label="搴忓彿">{{ item.id }}</el-descriptions-item>
+ <el-descriptions-item label="MN缂栧彿">{{ item.code }}</el-descriptions-item>
+ <el-descriptions-item label="鍚嶇О">{{ item.name }}</el-descriptions-item>
+ <el-descriptions-item label="鍦板潃">{{ item.address }}</el-descriptions-item>
+ <el-descriptions-item label="鐘舵��">{{ item.status }}</el-descriptions-item>
+ <el-descriptions-item label="鍒涘缓鏃堕棿">{{ item.createTime }}</el-descriptions-item>
+ <el-descriptions-item label="鏇存柊鏃堕棿">{{ item.updateTime }}</el-descriptions-item>
+ <el-descriptions-item label="澶囨敞">{{ item.remark }}</el-descriptions-item>
+ <el-descriptions-item label="缁忕含搴�">{{ item.lon }}, {{ item.lat }}</el-descriptions-item>
+ </el-descriptions> -->
+ <el-row justify="space-between">
+ <div>
+ <el-text>{{ item.id }}銆�</el-text>
+ <el-text>{{ item.name }}</el-text>
+ </div>
+ <div>
+ <el-text>MN缂栧彿锛歿{ item.code }}</el-text>
+ </div>
+ </el-row>
+ <div>
+ <el-text>鍦板潃锛�</el-text>
+ <el-text>{{ item.address }}</el-text>
+ </div>
+ <el-row justify="space-between">
+ <div>
+ <el-text size="small" type="info">缁忕含搴︼細{{ item.lon }}, {{ item.lat }}</el-text>
+ </div>
+ <el-space>
+ <div>
+ <el-text size="small" type="info">鍒涘缓鏃堕棿锛歿{ item.createTime }}</el-text>
+ </div>
+ <div>
+ <el-text size="small" type="info">鏇存柊鏃堕棿锛歿{ item.updateTime }}</el-text>
+ </div>
+ </el-space>
+ </el-row>
+ <el-row justify="end">
+ <el-button size="small" type="success" @click="add">娣诲姞</el-button>
+ </el-row>
+ </el-card>
+</template>
+<script setup>
+const props = defineProps({
+ item: {
+ type: Object,
+ default: () => {}
+ }
+});
+
+const emit = defineEmits(['add']);
+
+function add() {
+ emit('add', props.item);
+}
+</script>
diff --git a/src/views/fysp/support/components/ItemScene.vue b/src/views/fysp/support/components/ItemScene.vue
new file mode 100644
index 0000000..bdfeb45
--- /dev/null
+++ b/src/views/fysp/support/components/ItemScene.vue
@@ -0,0 +1,34 @@
+<template>
+ <el-card shadow="hover">
+ <el-row justify="space-between">
+ <div>
+ <el-text>{{ item.index }}銆�</el-text>
+ <el-text>{{ item.name }}</el-text>
+ </div>
+ <div>
+ <el-text>绫诲瀷锛歿{ item.type }}</el-text>
+ </div>
+ </el-row>
+ <div>
+ <el-text>鍖哄幙锛�</el-text>
+ <el-text>{{ item.districtname }}</el-text>
+ </div>
+ <el-row justify="start">
+ <el-button size="small" type="success" @click="add">娣诲姞</el-button>
+ </el-row>
+ </el-card>
+</template>
+<script setup>
+const props = defineProps({
+ item: {
+ type: Object,
+ default: () => {}
+ }
+});
+
+const emit = defineEmits(['add']);
+
+function add() {
+ emit('add', props.item);
+}
+</script>
--
Gitblit v1.9.3