From 2d637ba447da7e89ceaeded52ac3ac1b76f4f22b Mon Sep 17 00:00:00 2001
From: 龚焕茏 <2842157468@qq.com>
Date: 星期四, 07 三月 2024 13:42:19 +0800
Subject: [PATCH] 指标取值配置、交通指数配置
---
src/api/indicatorInfo/status.ts | 24 ++++++++
src/views/ti/trafficIndex/index.vue | 87 +++++++++++++++++++++++++----
src/api/indicatorInfo/index.ts | 13 ++++
src/api/ti/trafficIndex/icon.ts | 12 ++++
src/api/ti/trafficIndex/index.ts | 13 ++++
src/views/scenery/sceneryOperationData/index.vue | 20 +++++-
6 files changed, 153 insertions(+), 16 deletions(-)
diff --git a/src/api/indicatorInfo/index.ts b/src/api/indicatorInfo/index.ts
index d024779..7f014ff 100644
--- a/src/api/indicatorInfo/index.ts
+++ b/src/api/indicatorInfo/index.ts
@@ -1,6 +1,7 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { IndicatorInfoVO, IndicatorInfoForm, IndicatorInfoQuery } from '@/api/indicatorInfo/types';
+import { IndicatorStatus } from '@/api/indicatorInfo/status';
/**
* 鏌ヨ鎸囨爣鍙栧�煎垪琛�
@@ -17,6 +18,18 @@
};
/**
+ * 鏌ヨ鎸囨爣鍙栧�肩姸鎬�
+ * @returns {*}
+ */
+
+export const getIndicatorInfoStatus = (): AxiosPromise<IndicatorStatus[]> => {
+ return request({
+ url: '/demo/indicatorInfo/status',
+ method: 'get',
+ });
+};
+
+/**
* 鏌ヨ鎸囨爣鍙栧�艰缁�
* @param id
*/
diff --git a/src/api/indicatorInfo/status.ts b/src/api/indicatorInfo/status.ts
new file mode 100644
index 0000000..a3e2a33
--- /dev/null
+++ b/src/api/indicatorInfo/status.ts
@@ -0,0 +1,24 @@
+export interface IndicatorStatus {
+
+ /**
+ * 杞︽祦閲�
+ */
+ carFlowNum: int;
+
+ /**
+ * 浜烘祦閲�
+ */
+ personFlowNum: int;
+
+ /**
+ * 娓稿棰勭害
+ */
+ visitorSubNum: int;
+
+ /**
+ * 鍏ュ洯浜烘暟
+ */
+ enterGardenNum: int;
+
+
+}
diff --git a/src/api/ti/trafficIndex/icon.ts b/src/api/ti/trafficIndex/icon.ts
new file mode 100644
index 0000000..003f79e
--- /dev/null
+++ b/src/api/ti/trafficIndex/icon.ts
@@ -0,0 +1,12 @@
+export interface iconVO {
+ /**
+ * 涓婚敭id
+ */
+ id: string | number;
+
+ /**
+ * 鍥炬爣
+ */
+ name: string;
+
+}
diff --git a/src/api/ti/trafficIndex/index.ts b/src/api/ti/trafficIndex/index.ts
index b66db50..9117d01 100644
--- a/src/api/ti/trafficIndex/index.ts
+++ b/src/api/ti/trafficIndex/index.ts
@@ -1,6 +1,7 @@
import request from '@/utils/request';
import { AxiosPromise } from 'axios';
import { TrafficIndexVO, TrafficIndexForm, TrafficIndexQuery } from '@/api/ti/trafficIndex/types';
+import { iconVO } from '@/api/ti/trafficIndex/icon';
/**
* 鏌ヨ浜ら�氭寚鏁板垪琛�
@@ -17,6 +18,18 @@
};
/**
+ * 鏌ヨ閰嶇疆鍥炬爣
+ * @returns {*}
+ */
+
+export const getIcon = (): AxiosPromise<iconVO[]> => {
+ return request({
+ url: '/rs/trafficIndex/icon',
+ method: 'get'
+ });
+};
+
+/**
* 鏌ヨ浜ら�氭寚鏁拌缁�
* @param id
*/
diff --git a/src/views/scenery/sceneryOperationData/index.vue b/src/views/scenery/sceneryOperationData/index.vue
index 4ed518f..778c056 100644
--- a/src/views/scenery/sceneryOperationData/index.vue
+++ b/src/views/scenery/sceneryOperationData/index.vue
@@ -100,16 +100,16 @@
 
<el-date-picker v-model="form.periodDate" :type="pickerType" :value-format="pickerFormat" placeholder="璇烽�夋嫨缁熻鍛ㄦ湡" />
</el-form-item>
- <el-form-item label="杞︽祦閲�" prop="carFlowNum">
+ <el-form-item label="杞︽祦閲�" prop="carFlowNum" v-if="indicatorStatus.carFlowNum == 1">
<el-input v-model="form.carFlowNum" placeholder="璇疯緭鍏ヨ溅娴侀噺" />
</el-form-item>
- <el-form-item label="浜烘祦閲�" prop="personFlowNum">
+ <el-form-item label="浜烘祦閲�" prop="personFlowNum" v-if="indicatorStatus.personFlowNum == 1">
<el-input v-model="form.personFlowNum" placeholder="璇疯緭鍏ヤ汉娴侀噺" />
</el-form-item>
- <el-form-item label="娓稿棰勭害" prop="visitorSubNum">
+ <el-form-item label="娓稿棰勭害" prop="visitorSubNum" v-if="indicatorStatus.visitorSubNum == 1">
<el-input v-model="form.visitorSubNum" placeholder="璇疯緭鍏ユ父瀹㈤绾�" />
</el-form-item>
- <el-form-item label="鍏ュ洯浜烘暟" prop="enterGardenNum">
+ <el-form-item label="鍏ュ洯浜烘暟" prop="enterGardenNum" v-if="indicatorStatus.enterGardenNum == 1">
<el-input v-model="form.enterGardenNum" placeholder="璇疯緭鍏ュ叆鍥汉鏁�" />
</el-form-item>
<el-form-item label="鍦ㄥ矖璀﹀姏" prop="onPolice">
@@ -315,10 +315,22 @@
sceneryInfoNames.value = res.rows;
}
+import { getIndicatorInfoStatus } from '@/api/indicatorInfo';
+import { IndicatorStatus } from '@/api/indicatorInfo/status';
+// 璋冪敤鍚庣API鑾峰彇鎸囨爣鐘舵��
+const indicatorStatus = ref<IndicatorStatus[]>([]);
+
+/** 鏌ヨ鎸囨爣鍙栧�肩姸鎬� */
+const getIndicatorStatus = async () => {
+ const res = await getIndicatorInfoStatus();
+ indicatorStatus.value = res;
+}
+
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
reset();
getSceneryInfoName();
+ getIndicatorStatus();
dialog.visible = true;
dialog.title = "娣诲姞鏅尯杩愯鏁版嵁";
}
diff --git a/src/views/ti/trafficIndex/index.vue b/src/views/ti/trafficIndex/index.vue
index 8dd6780..a10682f 100644
--- a/src/views/ti/trafficIndex/index.vue
+++ b/src/views/ti/trafficIndex/index.vue
@@ -85,12 +85,46 @@
</el-card>
</div>
<div v-show="activeName=='second'">
- <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
-
- </transition>
-
-
- </div>
+ <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
+ <div>
+ <el-form-item :label="item.name + '锛�'" prop="" v-for="item in icons" :key="item.id">
+ <el-upload action="#" list-type="picture-card" :auto-upload="false">
+ <el-icon><Plus /></el-icon>
+ <template #file="{ file }">
+ <div>
+ <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
+ <span class="el-upload-list__item-actions">
+ <span
+ class="el-upload-list__item-preview"
+ @click="handlePictureCardPreview(file)"
+ >
+ <el-icon><zoom-in /></el-icon>
+ </span>
+ <span
+ v-if="!disabled"
+ class="el-upload-list__item-delete"
+ @click="handleDownload(file)"
+ >
+ <el-icon><Download /></el-icon>
+ </span>
+ <span
+ v-if="!disabled"
+ class="el-upload-list__item-delete"
+ @click="handleRemove(file)"
+ >
+ <el-icon><Delete /></el-icon>
+ </span>
+ </span>
+ </div>
+ </template>
+ </el-upload>
+ <el-dialog v-model="dialogVisible">
+ <img w-full :src="dialogImageUrl" alt="Preview Image" />
+ </el-dialog>
+ </el-form-item>
+ </div>
+ </transition>
+ </div>
<!-- 娣诲姞鎴栦慨鏀逛氦閫氭寚鏁板璇濇 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
<el-form ref="trafficIndexFormRef" :model="form" :rules="rules" label-width="80px">
@@ -191,9 +225,9 @@
</template>
<script setup name="TrafficIndex" lang="ts">
-import { listTrafficIndex, getTrafficIndex, delTrafficIndex, addTrafficIndex, updateTrafficIndex } from '@/api/ti/trafficIndex';
+import { listTrafficIndex, getTrafficIndex, delTrafficIndex, addTrafficIndex, updateTrafficIndex, getIcon } from '@/api/ti/trafficIndex';
import { TrafficIndexVO, TrafficIndexQuery, TrafficIndexForm } from '@/api/ti/trafficIndex/types';
-import type { TabsPaneContext, UploadProps, UploadUserFile } from "element-plus";
+import type { TabsPaneContext } from "element-plus";
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const trafficIndexList = ref<TrafficIndexVO[]>([]);
@@ -207,9 +241,6 @@
const activeName = ref('first');
const queryFormRef = ref<ElFormInstance>();
const trafficIndexFormRef = ref<ElFormInstance>();
-const dialogImageUrl =ref('');
-const dialogVisible= ref(false);
-const disabled= ref(false);
const dialog = reactive<DialogOption>({
visible: false,
title: ''
@@ -467,10 +498,42 @@
onMounted(() => {
getList();
+ getIcons();
});
+
+import { iconVO } from '@/api/ti/trafficIndex/icon';
+// 璋冪敤鍚庣API鑾峰彇鎸囨爣鐘舵��
+const icons = ref<iconVO[]>([]);
+
+/** 鏌ヨ鎸囨爣鍙栧�肩姸鎬� */
+const getIcons = async () => {
+ const res = await getIcon();
+ icons.value = res;
+}
/** 娓呯┖鍛ㄦ湡 */
const clearPeriod = () => {
form.value.periodDate = undefined;
-};
+};
+
+import { Delete, Download, Plus, ZoomIn } from '@element-plus/icons-vue'
+
+import type { UploadFile } from 'element-plus'
+
+const dialogImageUrl = ref('')
+const dialogVisible = ref(false)
+const disabled = ref(false)
+
+const handleRemove = (file: UploadFile) => {
+ console.log(file)
+}
+
+const handlePictureCardPreview = (file: UploadFile) => {
+ dialogImageUrl.value = file.url!
+ dialogVisible.value = true
+}
+
+const handleDownload = (file: UploadFile) => {
+ console.log(file)
+}
</script>
--
Gitblit v1.8.0