From 6641cefa084db2636a997de00fde5be167788e1e Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期四, 29 五月 2025 10:41:28 +0800
Subject: [PATCH] 优化定时加载
---
/dev/null | 341 ------------------------------------------
src/store/simulation.js | 3
src/store/simAPI.js | 5
src/api/trApi.js | 10
src/views/left/KGSimOption/PredictiveSimulation.vue | 18 +
src/views/left/CitySim.vue | 3
src/components/monifangzhen/schemeCard.vue | 97 +++++++++--
7 files changed, 103 insertions(+), 374 deletions(-)
diff --git a/src/api/trApi.js b/src/api/trApi.js
index c32fcc5..3581efe 100644
--- a/src/api/trApi.js
+++ b/src/api/trApi.js
@@ -24,8 +24,10 @@
// 鑾峰彇鏂规鍒楄〃
export async function getSimData() {
try {
- const res = await instance.get("/simu/selectPage");
- return res.data; // 杩斿洖瀹為檯鏁版嵁锛堥�氬父 res.data 鎵嶆槸鎺ュ彛杩斿洖鐨勫唴瀹癸級
+ const res = await instance.get("/simu/selectPage", {
+ params: { pageSize: 100 },
+ });
+ return res.data;
} catch (error) {
console.error("Error fetching data:", error);
throw error; // 鎶涘嚭閿欒锛岃璋冪敤鏂瑰彲浠ユ崟鑾�
@@ -36,7 +38,7 @@
export async function getSimDataById(id) {
try {
const res = await instance.get(`/simu/selectPage?id=${id}`);
- return res.data; // 杩斿洖瀹為檯鏁版嵁锛堥�氬父 res.data 鎵嶆槸鎺ュ彛杩斿洖鐨勫唴瀹癸級
+ return res.data;
} catch (error) {
console.error("Error fetching data:", error);
throw error; // 鎶涘嚭閿欒锛岃璋冪敤鏂瑰彲浠ユ崟鑾�
@@ -132,7 +134,7 @@
// 鑾峰彇姘翠綅姘存繁
export async function getFlowRate(data) {
// console.log(data,'鍙戦�佺殑鏁版嵁锛�');
-
+
try {
const res = await instance.get("/simu/position", {
params: data
diff --git a/src/components/monifangzhen/schemeCard.vue b/src/components/monifangzhen/schemeCard.vue
index 8a0b811..3d1d2d1 100644
--- a/src/components/monifangzhen/schemeCard.vue
+++ b/src/components/monifangzhen/schemeCard.vue
@@ -13,7 +13,10 @@
<p>鍒涘缓鏃堕棿 : {{ formatTime(item.createTime) }}</p>
<p>
鏂规鐘舵�� :
- <span style="color: aquamarine">{{ item.result || "鍒涘缓浠跨湡" }}</span>
+ <span style="color: aquamarine">
+ {{ item.result === -1 ? "鍑洪敊" : item.result || "鍒涘缓浠跨湡" }}
+ </span>
+ <!-- <span style="color: aquamarine">{{ item.result || "鍒涘缓浠跨湡" }}</span> -->
<!-- <span style="color: aquamarine">{{
statusText[item.status] || "鏈煡"
}}</span> -->
@@ -50,12 +53,20 @@
import { initeWaterPrimitiveView } from "@/utils/water";
import Message from "@/components/tools/Message.vue";
import { useSimStore } from "@/store/simulation.js";
+import { SimAPIStore } from "@/store/simAPI";
import schemeInfo from "@/components/monifangzhen/schemeInfo.vue";
import { ElMessage, ElMessageBox } from "element-plus";
const emit = defineEmits(["start", "end", "reset", "closeBtn"]);
-import { getSimStart, getSimDataById } from "@/api/trApi";
+import {
+ getRegionData,
+ getSimData,
+ deleteSimData,
+ getSimStart,
+ getSimDataById,
+} from "@/api/trApi.js";
const simStore = useSimStore();
+const simAPIStore = SimAPIStore();
// 閫変腑鐨勬柟妗� ID
const selectedId = ref(null);
// 褰撳墠閫変腑鐨勬柟妗堜俊鎭�
@@ -72,16 +83,22 @@
10: "瀹屾垚",
20: "鍑洪敊",
};
+
function formatTime(time) {
return dayjs(time).format("YYYY-MM-DD HH:mm:ss");
}
+
const messageShow = ref(false);
+
const schemeInfoShow = ref(false);
+
const mesData = ref(null);
+
function setSchemClick(item) {
mesData.value = item;
messageShow.value = true;
}
+
function close() {
messageShow.value = false;
}
@@ -113,8 +130,11 @@
simStore.setSelectedScheme(item);
console.log("鏈夋湇鍔″悕绉�");
}
+
const flyHeight = ref(100000);
+
const shouldShowFill = false;
+
// 姹傝В鍣ㄦ眰瑙ｅ畬鎴愪箣鍚庢墠鍙互鏄剧ず鏃堕棿杞�
if (item.status == 10) {
// 鍙湁琛屾斂鍖哄垝鎵ц
@@ -135,14 +155,17 @@
emit("start");
}
}
+
function endPlay() {
emit("end");
}
+
function handleBack(value) {
if (value === false) {
schemeInfoShow.value = false;
}
}
+
const handleHideSchemeInfo = () => {
schemeInfoShow.value = false;
emit("closeBtn", true);
@@ -151,26 +174,6 @@
// 娉ㄥ唽浜嬩欢鐩戝惉鍣�
EventBus.on("hide-schemeInfo", handleHideSchemeInfo);
-/////////////////////// 璋冪敤鎺ュ彛锛堜娇鐢ㄦ椂鎵撳紑锛� ///////////////////////
-import { getRegionData, getSimData, deleteSimData } from "@/api/trApi.js";
-
-onMounted(() => {
- getScheme(); // 椤甸潰鍔犺浇鏃剁珛鍗宠幏鍙栨暟鎹�
- intervalId = setInterval(getScheme, 60 * 1000); // 姣忛殧涓�鍒嗛挓鎵ц涓�娆�
-});
-
-onUnmounted(() => {
- if (intervalId !== null) {
- clearInterval(intervalId); // 娓呴櫎瀹氭椂鍣�
- intervalId = null; // 閲嶇疆 intervalId
- }
-});
-
-const props = defineProps({
- deleteSim: Boolean, // 鎺ユ敹鐖剁粍浠朵紶閫掔殑鍑芥暟
- showAddIns: Boolean,
-});
-
const schemeList = ref([]);
let intervalId = null; // 鐢ㄤ簬瀛樺偍 setInterval 鐨勮繑鍥炲��
// 鑾峰彇鏂规鍒楄〃
@@ -178,10 +181,49 @@
try {
const res = await getSimData();
schemeList.value = res.data;
+
+ const shouldStop = schemeList.value.every(
+ (item) =>
+ item.result == "鍒涘缓浠跨湡" ||
+ item.result == "瀹屾垚" ||
+ item.result == "-1"
+ );
+ simAPIStore.shouldPoll = !shouldStop; // 淇敼 Pinia 鐘舵��
+ // 3. 濡傛灉闇�瑕佸仠姝�
+ if (shouldStop) {
+ if (intervalId) {
+ clearInterval(intervalId);
+ intervalId = null;
+ console.log("鍋滄杞");
+ }
+ return;
+ }
} catch (error) {
console.error("Error fetching data:", error);
}
}
+
+// 鐩戝惉 shouldPoll 鐘舵�佸彉鍖�
+watch(
+ () => simAPIStore.shouldPoll,
+ (isStarted) => {
+ console.log(isStarted, "瀹氭椂鍣�");
+ if (isStarted) {
+ getScheme(); // 棣栨绔嬪嵆鑾峰彇涓�娆�
+ intervalId = setInterval(getScheme, 60 * 1000); // 姣忛殧涓�鍒嗛挓鎵ц
+ }
+ // else if (intervalId !== null) {
+ // clearInterval(intervalId);
+ // intervalId = null;
+ // }
+ },
+ { immediate: true }
+);
+
+const props = defineProps({
+ deleteSim: Boolean, // 鎺ユ敹鐖剁粍浠朵紶閫掔殑鍑芥暟
+ showAddIns: Boolean,
+});
// 鏂板缓鏂规瀹屾垚涔嬪悗鏂规鍒楄〃闇�瀹炴椂鍒锋柊
watch(
@@ -231,9 +273,18 @@
})
.catch(() => {});
};
-/////////////////////// 璋冪敤鎺ュ彛缁撴潫 ///////////////////////
+
+onMounted(() => {
+ getScheme(); // 椤甸潰鍔犺浇鏃剁珛鍗宠幏鍙栨暟鎹�
+});
+
onUnmounted(() => {
EventBus.off("hide-schemeInfo", handleHideSchemeInfo);
+
+ if (intervalId !== null) {
+ clearInterval(intervalId); // 娓呴櫎瀹氭椂鍣�
+ intervalId = null; // 閲嶇疆 intervalId
+ }
});
</script>
diff --git a/src/store/simAPI.js b/src/store/simAPI.js
index b09f6a5..061ddca 100644
--- a/src/store/simAPI.js
+++ b/src/store/simAPI.js
@@ -5,6 +5,10 @@
import dayjs from 'dayjs'
export const SimAPIStore = defineStore('SimAPI', () => {
+
+ // 瀹氭椂鍣�
+ const shouldPoll = ref(false)
+
const selectTab = ref("琛屾斂鍖哄垝浠跨湡")
const isLoading = ref(false)
@@ -133,6 +137,7 @@
return {
selectTab,
isLoading,
+ shouldPoll,
handleClickTab,
addSimCheme,
saveScheme,
diff --git a/src/store/simulation.js b/src/store/simulation.js
index 3911a2c..56c028e 100644
--- a/src/store/simulation.js
+++ b/src/store/simulation.js
@@ -1,7 +1,6 @@
// stores/ui.js
import { defineStore } from 'pinia'
import { ref } from 'vue'
-import { createSimData } from '@/api/trApi'
export const useSimStore = defineStore('simulation', () => {
// 闅愭偅鐐瑰垪琛�
@@ -30,7 +29,9 @@
const schemCard = ref([])
const backToHome = ref(false)
const selectedScheme = ref(null)
+ // 闄嶉洦鏁版嵁鍒楄〃
const rainFalls = ref()
+ // 闄嶉洦鍗曚綅
const intensityUnit = ref()
const setSelectedScheme = (scheme) => {
selectedScheme.value = scheme
diff --git a/src/views/left/CitySim.vue b/src/views/left/CitySim.vue
index cf42766..6e70e1d 100644
--- a/src/views/left/CitySim.vue
+++ b/src/views/left/CitySim.vue
@@ -512,10 +512,11 @@
// 璋冪敤姹傝В鍣�
const simStartRes = await getSimStart(schemeId);
- console.log(simStartRes, "getSimStart 杩斿洖缁撴灉");
// 鍏抽棴閫夋嫨鍖哄煙绐楀彛銆佸垵濮嬪寲瑙嗗浘骞跺紑濮嬫ā鎷�
EventBus.emit("close-selectArea");
+ simStore.shouldPoll = true;
+
// 鏆傛椂涓嶅湪姝ゅ寮�濮嬫ā鎷燂紝妯℃嫙閮藉湪鏂规鍒楄〃涓繘琛屾ā鎷�
// initeWaterPrimitiveView();
// startSimulate();
diff --git a/src/views/left/KGSimOption/PredictiveSimulation.vue b/src/views/left/KGSimOption/PredictiveSimulation.vue
index 5c86b65..a82bb56 100644
--- a/src/views/left/KGSimOption/PredictiveSimulation.vue
+++ b/src/views/left/KGSimOption/PredictiveSimulation.vue
@@ -88,7 +88,7 @@
></el-option>
</el-select>
</el-form-item>
- <el-form-item label="閫夋嫨鏃堕棿:">
+ <el-form-item label="閫夋嫨鏃堕棿:" v-show="forms.prediction != '闄嶉洦鍦烘'">
<el-date-picker
v-model="forms.hours"
type="datetimerange"
@@ -98,6 +98,13 @@
date-format="YYYY/MM/DD ddd"
time-format="A hh:mm:ss"
@change="change"
+ />
+ </el-form-item>
+ <el-form-item label="閫夋嫨鏃堕棿:" v-show="forms.prediction == '闄嶉洦鍦烘'">
+ <el-date-picker
+ v-model="forms.hours"
+ type="datetime"
+ placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
/>
</el-form-item>
<el-form-item label="棰勮鏃堕暱:">
@@ -113,7 +120,7 @@
<div class="buttons">
<el-button type="primary" @click="openPlan">鎵撳紑鏂规</el-button>
<el-button type="primary" @click="openSaveDialog">淇濆瓨鏂规</el-button>
- <el-button type="success" @click="startPlay">寮�濮嬫ā鎷�</el-button>
+ <el-button type="success" @click="startPlay">淇濆瓨骞跺紑濮嬫ā鎷�</el-button>
</div>
</div>
</template>
@@ -209,7 +216,7 @@
};
// 闄嶉洦鍦烘閫夋嫨
const rainFallChange = (val) => {
- // console.log(val, "val");
+ console.log(val, "val");
const decimalHours = (val.rainfallDuration.match(/(\d+)鏃�(\d+)鍒�/) || [])
.slice(1)
.reduce((acc, curr, i) => acc + parseInt(curr, 10) / (i === 0 ? 1 : 60), 0)
@@ -261,7 +268,7 @@
// 寮�濮嬫ā鎷�
async function startPlay() {
try {
- formData.geom = props.selectedArea;
+ forms.geom = props.selectedArea;
// 淇濆瓨鏂规
const res = await simStore.addSimCheme(forms);
const schemeId = res.data?.data?.id;
@@ -277,6 +284,8 @@
// 鍏抽棴閫夋嫨鍖哄煙绐楀彛銆佸垵濮嬪寲瑙嗗浘骞跺紑濮嬫ā鎷�
EventBus.emit("close-selectArea");
+
+ simStore.shouldPoll = true;
// 鏆傛椂涓嶅湪姝ゅ寮�濮嬫ā鎷燂紝妯℃嫙閮藉湪鏂规鍒楄〃涓繘琛屾ā鎷�
// initeWaterPrimitiveView();
// startSimulate();
@@ -287,6 +296,7 @@
});
} catch (error) {
ElMessage.error("鍚姩妯℃嫙澶辫触锛岃绋嶅悗鍐嶈瘯");
+ console.log(error);
}
}
diff --git a/src/views/left/KGSimOption/RealTimeSimulation copy.vue b/src/views/left/KGSimOption/RealTimeSimulation copy.vue
deleted file mode 100644
index a5ac07e..0000000
--- a/src/views/left/KGSimOption/RealTimeSimulation copy.vue
+++ /dev/null
@@ -1,341 +0,0 @@
-<template>
- <div class="real-time-simulation">
- <div class="left-top">
- <span>瀹炴椂妯℃嫙</span>
- <span class="clickable-text" @click="toggleDetails">{{
- isCollapsed ? "灞曞紑" : "鏀惰捣"
- }}</span>
- </div>
- <div class="details" :class="{ hidden: isCollapsed }">
- <div class="input-group">
- <div class="input-item">
- <label>鏂规鍚嶇О:</label>
- <el-input
- v-model="schemeName"
- type="text"
- placeholder="璇疯緭鍏�"
- ></el-input>
- </div>
- <div class="input-item">
- <label>闆ㄩ噺鏁版嵁:</label>
- <el-select
- v-model="selectedRainfall"
- placeholder="璇烽�夋嫨"
- popper-class="mySelectStyle"
- >
- <el-option
- v-for="item in rainfallData"
- :key="item.id"
- :label="item.name"
- :value="item.id"
- ></el-option>
- </el-select>
- </div>
- </div>
- <div class="table-container">
- <div
- class="table-row"
- v-for="(item, index) in filteredTableData"
- :key="index"
- >
- <input type="checkbox" v-model="item.selected" />
- <span>{{ item.name }}</span>
- </div>
- </div>
- <!-- <div style="margin-top: 10px;">
- <label>浠跨湡鍙傛暟:</label>
- <div style="width: 100%; height: 60px; background-color: #fff;"></div>
- </div> -->
- </div>
- <div class="buttons">
- <el-button type="primary" @click="openSaveDialog">淇濆瓨鏂规</el-button>
- <el-button type="success" @click="startPlay">寮�濮嬫ā鎷�</el-button>
- <el-button type="success" @click="futurePredictions">鏈潵棰勬祴</el-button>
- </div>
- </div>
-</template>
-
-<script setup>
-import { ref, watch, defineProps, computed, inject } from "vue";
-import { ElMessage } from "element-plus";
-import { initeWaterPrimitiveView } from "@/utils/water";
-import { SimAPIStore } from "@/store/simAPI";
-import { EventBus } from "@/eventBus"; // 寮曞叆浜嬩欢鎬荤嚎
-
-// 鑾峰彇 Store 瀹炰緥
-const simStore = SimAPIStore();
-
-// 鑾峰彇 Store 瀹炰緥
-const schemeName = ref("鏂规鍚嶇О"); // 鏂规鍚嶇О
-
-// 宸ュ叿鍑芥暟锛氭繁鎷疯礉骞惰缃粯璁ら�変腑鐘舵��
-function deepCloneAndSetSelected(data) {
- const newData = {};
- for (const key in data) {
- newData[key] = data[key].map((item) => ({ ...item, selected: true }));
- }
- return newData;
-}
-
-// 鎺ユ敹鐖剁粍浠朵紶閫掔殑 props
-const props = defineProps({
- selectedArea: {
- type: Object,
- required: true,
- },
-});
-
-// 瀛愮粍浠跺唴閮ㄧ姸鎬�
-const rainfallData = ref([]); // 闆ㄩ噺鏁版嵁
-const tableData = ref({}); // 琛ㄦ牸鏁版嵁锛堟寜闆ㄩ噺鏁版嵁鍒嗙粍锛�
-const selectedRainfall = ref(""); // 褰撳墠閫変腑鐨勯洦閲忔暟鎹�
-const isCollapsed = ref(false); // 鎺у埗灞曞紑/鏀惰捣鐘舵��
-const saveDialogVisible = ref(false); // 鎺у埗淇濆瓨鏂规瀵硅瘽妗嗘樉绀虹姸鎬�
-
-// 妯℃嫙涓嶅悓鍖哄煙鐨勬暟鎹�
-const areaDataMap = {
- 瀛欒儭娌�: {
- rainfallData: [
- { id: "1", name: "姘旇薄瀹炴椂鏁版嵁 - 瀛欒儭娌�" },
- { id: "2", name: "闆ㄩ噺璁″疄鏃舵暟鎹� - 瀛欒儭娌�" },
- ],
- tableData: {
- 1: [
- { id: "001", name: "瀛欒儭娌熸皵璞＄珯001" },
- { id: "002", name: "瀛欒儭娌熸皵璞＄珯002" },
- ],
- 2: [
- { id: "003", name: "瀛欒儭娌熼洦閲忚003" },
- { id: "004", name: "瀛欒儭娌熼洦閲忚004" },
- ],
- },
- },
- 楸兼按娲炲悗娌�: {
- rainfallData: [
- { id: "1", name: "姘旇薄瀹炴椂鏁版嵁 - 楸兼按娲炲悗娌�" },
- { id: "2", name: "闆ㄩ噺璁″疄鏃舵暟鎹� - 楸兼按娲炲悗娌�" },
- ],
- tableData: {
- 1: [
- { id: "005", name: "楸兼按娲炲悗娌熸皵璞＄珯005" },
- { id: "006", name: "楸兼按娲炲悗娌熸皵璞＄珯006" },
- ],
- 2: [
- { id: "007", name: "楸兼按娲炲悗娌熼洦閲忚007" },
- { id: "008", name: "楸兼按娲炲悗娌熼洦閲忚008" },
- ],
- },
- },
- 浜庡瑗挎矡: {
- rainfallData: [
- { id: "1", name: "姘旇薄瀹炴椂鏁版嵁 - 浜庡瑗挎矡" },
- { id: "2", name: "闆ㄩ噺璁″疄鏃舵暟鎹� - 浜庡瑗挎矡" },
- ],
- tableData: {
- 1: [
- { id: "009", name: "浜庡瑗挎矡姘旇薄绔�009" },
- { id: "010", name: "浜庡瑗挎矡姘旇薄绔�010" },
- ],
- 2: [
- { id: "011", name: "浜庡瑗挎矡闆ㄩ噺璁�011" },
- { id: "012", name: "浜庡瑗挎矡闆ㄩ噺璁�012" },
- ],
- },
- },
-};
-
-// 鏍规嵁 selectedArea 鏇存柊鏁版嵁
-watch(
- () => props.selectedArea,
- (newArea) => {
- if (areaDataMap[newArea]) {
- rainfallData.value = areaDataMap[newArea].rainfallData;
- // 浣跨敤娣辨嫹璐濊缃粯璁ら�変腑鐘舵��
- tableData.value = deepCloneAndSetSelected(areaDataMap[newArea].tableData);
- selectedRainfall.value = ""; // 娓呯┖閫変腑鐨勯洦閲忔暟鎹�
- } else {
- rainfallData.value = [];
- tableData.value = {};
- selectedRainfall.value = "";
- }
- },
- { immediate: true } // 绔嬪嵆鎵ц涓�娆★紝纭繚鍒濆鏁版嵁姝ｇ‘
-);
-
-// 鍔ㄦ�佽绠楄〃鏍兼暟鎹�
-const filteredTableData = computed(() => {
- return selectedRainfall.value && tableData.value[selectedRainfall.value]
- ? tableData.value[selectedRainfall.value]
- : [];
-});
-
-// 鑾峰彇褰撳墠閫変腑鐨勯洦閲忔暟鎹悕绉�
-const selectedRainfallName = computed(() => {
- const selected = rainfallData.value.find(
- (item) => item.id === selectedRainfall.value
- );
- return selected ? selected.name : "";
-});
-
-// 鑾峰彇褰撳墠閫変腑鐨勮澶囦俊鎭�
-const selectedDevices = computed(() => {
- return filteredTableData.value.filter((item) => item.selected);
-});
-
-// 灏佽鏋勯�犺〃鍗曠殑鏂规硶
-const buildSchemeForm = () => {
- return {
- name: schemeName.value,
- geom: props.selectedArea,
- type: 2,
- gauges: [
- {
- id: "xxxxxxxxxxxxxx",
- name: "闆ㄩ噺璁�1",
- x: 119.0,
- y: 28.0,
- r: 10000,
- },
- {
- id: "xxxxxxxxxxxxxx",
- name: "闆ㄩ噺璁�2",
- x: 119.0,
- y: 28.0,
- r: 10000,
- },
- ],
- };
-};
-
-// 鎵撳紑淇濆瓨鏂规瀵硅瘽妗�
-const openSaveDialog = async () => {
- await simStore.addSimCheme(buildSchemeForm());
- EventBus.emit("close-selectArea");
-};
-
-// 鍏抽棴淇濆瓨鏂规瀵硅瘽妗�
-const handleClose = () => {
- saveDialogVisible.value = false;
-};
-
-// 娉ㄥ叆妯℃嫙鎿嶄綔鏂规硶
-const { startSimulate, endSimulate } = inject("simulateActions");
-
-async function startPlay() {
- const selectedItems = filteredTableData.value.filter((item) => item.selected);
- if (selectedItems.length > 0) {
- console.log(
- "閫変腑鐨勯」锛�",
- selectedItems.map((item) => item.name)
- );
- } else {
- console.log("鏈�変腑浠讳綍椤�");
- }
- console.log("褰撳墠閫変腑鐨勫尯鍩燂細", props.selectedArea);
- console.log("褰撳墠閫変腑鐨勯洦閲忔暟鎹細", selectedRainfall.value);
- // 寮�濮嬫ā鎷熷墠闇�瑕佸厛淇濆瓨鏂规
- await simStore.addSimCheme(buildSchemeForm());
- EventBus.emit("close-selectArea");
- initeWaterPrimitiveView();
- startSimulate();
-}
-
-const toggleDetails = () => {
- isCollapsed.value = !isCollapsed.value;
-};
-
-const futurePredictions = () => {
- console.log("鏈潵棰勬祴鎸夐挳琚偣鍑�");
-};
-</script>
-
-<style scoped>
-.custom-dialog {
- z-index: 3000 !important;
-}
-.real-time-simulation {
- margin-bottom: 20px;
-}
-
-.clickable-text {
- margin-left: 160px;
- cursor: pointer;
- font-size: 14px;
- color: #61f7d4;
-}
-
-.details {
- margin-top: 10px;
- transition: height 0.3s ease, opacity 0.3s ease;
- overflow: hidden;
-}
-
-.hidden {
- height: 0;
- opacity: 0;
-}
-
-.input-group {
- display: flex;
- flex-direction: column;
- gap: 10px;
- padding-right: 10px;
- box-sizing: border-box;
-}
-
-.input-item {
- display: flex;
- align-items: center;
-}
-
-label {
- text-align: left;
- white-space: nowrap;
- margin-right: 10px;
-}
-
-.el-select {
- flex: 4;
- text-align: left;
- margin-bottom: 10px;
-}
-
-.table-container {
- font-size: 12px;
- height: 120px;
- overflow-y: auto;
- border: 1px solid #ddd;
- border-radius: 4px;
- padding: 5px;
-}
-
-.table-row {
- display: flex;
- justify-content: space-between;
- padding: 5px 0;
- border-bottom: 1px solid #ddd;
-}
-
-.table-row:last-child {
- border-bottom: none;
-}
-
-.table-row span {
- flex: 1;
- text-align: left;
-}
-
-.table-row input[type="checkbox"] {
- margin-right: 10px;
-}
-
-.buttons {
- margin-top: 20px;
- display: flex;
- gap: 10px;
-}
-
-.el-button {
- flex: 1;
-}
-</style>
--
Gitblit v1.9.3