Compare commits

..

2 Commits

10 changed files with 92 additions and 50 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -421,7 +421,7 @@ const vClickOutside = {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: vh(8); gap: vh(8);
animation: scroll 40s linear infinite; animation: scroll 8s linear infinite;
will-change: transform; will-change: transform;
padding-right: vw(4); // padding-right: vw(4); //

View File

@ -35,6 +35,7 @@ import lineCodeIcon from '../../assets/images/LocationPanel/线路编号icon.png
import classNumberIcon from '../../assets/images/LocationPanel/路线桩号icon.png' import classNumberIcon from '../../assets/images/LocationPanel/路线桩号icon.png'
import inspectorIcon from '../../assets/images/LocationPanel/路段巡查员icon.png' import inspectorIcon from '../../assets/images/LocationPanel/路段巡查员icon.png'
import phoneIcon from '../../assets/images/LocationPanel/联系电话icon.png' import phoneIcon from '../../assets/images/LocationPanel/联系电话icon.png'
import dateIcon from '../../assets/images/LocationPanel/日期icon.png'
defineProps({ defineProps({
expanded: { expanded: {
@ -57,6 +58,8 @@ const locationInfo = [
{ label: '灾害桩号', value: 'K130 + 800', icon: classNumberIcon }, { label: '灾害桩号', value: 'K130 + 800', icon: classNumberIcon },
{ label: '路段巡路员', value: '张强', icon: inspectorIcon }, { label: '路段巡路员', value: '张强', icon: inspectorIcon },
{ label: '联系电话', value: '13987657892', icon: phoneIcon }, { label: '联系电话', value: '13987657892', icon: phoneIcon },
{ label: '演练日期', value: '2025-11-19', icon: dateIcon },
] ]
</script> </script>
@ -67,7 +70,7 @@ const locationInfo = [
.location-panel { .location-panel {
width: 100%; width: 100%;
padding: clamp(16px, vh(16), 18px) clamp(6px, vw(6), 6px); padding: clamp(16px, vh(16), 18px) clamp(6px, vw(6), 6px);
background: url('../../assets/images/LocationPanel/地理位置内容背景.png') no-repeat center center; background: url('../../assets/images/LocationPanel/地理位置展出1.png') no-repeat center center;
background-size: 100% 100%; background-size: 100% 100%;
border-radius: vw(8); border-radius: vw(8);
box-shadow: 0 0 vw(12) rgba(0, 0, 0, 0.35); box-shadow: 0 0 vw(12) rgba(0, 0, 0, 0.35);
@ -82,7 +85,7 @@ const locationInfo = [
display: grid; display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-rows: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr));
gap: clamp(2px, vh(4), 6px) 0px; gap: clamp(2px, vh(10), 6px) 0px;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }

View File

@ -17,7 +17,7 @@
<span class="col-index">序号</span> <span class="col-index">序号</span>
<span class="col-name">{{ getColumnName('name') }}</span> <span class="col-name">{{ getColumnName('name') }}</span>
<span class="col-dept">{{ getColumnName('dept') }}</span> <span class="col-dept">{{ getColumnName('dept') }}</span>
<span class="col-location">位置信息(公里)</span> <!-- <span class="col-location">位置信息(公里)</span> -->
<span class="col-action">操作</span> <span class="col-action">操作</span>
</div> </div>
@ -30,7 +30,7 @@
<span class="col-index">{{ index + 1 }}</span> <span class="col-index">{{ index + 1 }}</span>
<span class="col-name">{{ item.name }}</span> <span class="col-name">{{ item.name }}</span>
<span class="col-dept">{{ item.department || item.type || '-' }}</span> <span class="col-dept">{{ item.department || item.type || '-' }}</span>
<span class="col-location">{{ item.distance || item.altitude || '-' }}</span> <!-- <span class="col-location">{{ item.distance || item.altitude || '-' }}</span> -->
<span class="col-action" @click="linkToItem(item)"> <span class="col-action" @click="linkToItem(item)">
联动 联动
</span> </span>
@ -111,7 +111,7 @@ const getColumnName = (type) => {
.table-header { .table-header {
display: grid; display: grid;
grid-template-columns: vw(50) 1fr 1fr 1fr vw(80); grid-template-columns: vw(50) 1fr 1fr vw(80);
gap: vw(8); gap: vw(8);
padding: vh(12) vw(16); padding: vh(12) vw(16);
// background: rgba(20, 53, 118, 0.5); // background: rgba(20, 53, 118, 0.5);
@ -147,7 +147,7 @@ const getColumnName = (type) => {
.table-row { .table-row {
display: grid; display: grid;
grid-template-columns: vw(50) 1fr 1fr 1fr vw(80); grid-template-columns: vw(50) 1fr 1fr vw(80);
gap: vw(8); gap: vw(8);
padding: vh(6) vw(16); padding: vh(6) vw(16);
background: linear-gradient(to right, #163b60, #133147); background: linear-gradient(to right, #163b60, #133147);

View File

@ -58,6 +58,13 @@ const handleClick = () => {
font-weight: 500; font-weight: 500;
white-space: nowrap; white-space: nowrap;
&:hover {
background-image: none;
background-color: #4FECFF;
color: #062B5B;
border-radius: 5px;
}
&__icon { &__icon {
width: vw(16); width: vw(16);
height: vh(16); height: vh(16);
@ -95,7 +102,7 @@ const handleClick = () => {
} }
&--medium { &--medium {
padding: vh(10) vw(20); padding: vh(12) vw(32);
font-size: fs(14); font-size: fs(14);
} }

View File

@ -19,6 +19,7 @@
class="custom-select" class="custom-select"
popper-class="custom-dropdown" popper-class="custom-dropdown"
> >
<el-option label="陈前" value="陈前" />
<el-option label="王军" value="王军" /> <el-option label="王军" value="王军" />
<el-option label="李明" value="李明" /> <el-option label="李明" value="李明" />
<el-option label="张伟" value="张伟" /> <el-option label="张伟" value="张伟" />
@ -31,6 +32,7 @@
class="custom-select" class="custom-select"
popper-class="custom-dropdown" popper-class="custom-dropdown"
> >
<el-option label="樵继川" value="樵继川" />
<el-option label="刘勇" value="刘勇" /> <el-option label="刘勇" value="刘勇" />
<el-option label="陈强" value="陈强" /> <el-option label="陈强" value="陈强" />
<el-option label="赵军" value="赵军" /> <el-option label="赵军" value="赵军" />
@ -59,7 +61,14 @@
class="custom-select" class="custom-select"
popper-class="custom-dropdown" popper-class="custom-dropdown"
> >
<el-option label="公安交警、交通执法队" value="公安交警、交通执法队" /> <el-option
label="忠县交通巡逻警察大队"
value="忠县交通巡逻警察大队"
/>
<el-option
label="公安交警、交通执法队"
value="公安交警、交通执法队"
/>
<el-option label="交通管理局" value="交通管理局" /> <el-option label="交通管理局" value="交通管理局" />
</el-select> </el-select>
</div> </div>
@ -81,6 +90,10 @@
class="custom-select" class="custom-select"
popper-class="custom-dropdown" popper-class="custom-dropdown"
> >
<el-option
label="忠县交通运输综合执法支队"
value="忠县交通运输综合执法支队"
/>
<el-option label="xxx消防队" value="xxx消防队" /> <el-option label="xxx消防队" value="xxx消防队" />
<el-option label="应急救援队" value="应急救援队" /> <el-option label="应急救援队" value="应急救援队" />
</el-select> </el-select>
@ -92,6 +105,7 @@
class="custom-select" class="custom-select"
popper-class="custom-dropdown" popper-class="custom-dropdown"
> >
<el-option label="忠县人民医院" value="忠县人民医院" />
<el-option label="xx医院" value="xx医院" /> <el-option label="xx医院" value="xx医院" />
<el-option label="中心医院" value="中心医院" /> <el-option label="中心医院" value="中心医院" />
</el-select> </el-select>
@ -176,10 +190,16 @@
:key="plan.id" :key="plan.id"
class="dispatch-card" class="dispatch-card"
> >
<button class="close-btn" @click="handleDeletePlan(plan.id)" title="删除">×</button> <button
class="close-btn"
@click="handleDeletePlan(plan.id)"
title="删除"
>
×
</button>
<h4 class="plan-name"> <h4 class="plan-name">
<span class="plan-icon"></span> <span class="plan-icon"></span>
基地{{ plan.id }}{{ plan.stationName || 'xxxxx名称' }} 基地{{ plan.id }}{{ plan.stationName || "xxxxx名称" }}
</h4> </h4>
<div class="resource-grid"> <div class="resource-grid">
<div <div
@ -240,12 +260,12 @@ const availableStations = computed(() => props.stations);
* 表单数据 * 表单数据
*/ */
const formData = reactive({ const formData = reactive({
commander: "王军", commander: "陈前",
viceCommander: "刘勇", viceCommander: "樵继川",
trafficControl: "公安交警、交通执法队", trafficControl: "忠县交通巡逻警察大队",
infoRelease: "融媒体中心", infoRelease: "融媒体中心",
vehicleDispatch: "xxx消防队", vehicleDispatch: "忠县交通运输综合执法支队",
personnelRescue: "xx医院", personnelRescue: "忠县人民医院",
clearanceMethod: "两端对接抢通,必要时开辟工作面", clearanceMethod: "两端对接抢通,必要时开辟工作面",
estimatedTime: "6小时", estimatedTime: "6小时",
}); });
@ -259,41 +279,41 @@ const clearanceSteps = reactive([
number: "①", number: "①",
title: "评估封控", title: "评估封控",
content: content:
"对现场进行封控,清点各类应急物资提前到达现场,划定作业区与危险区,设立观察哨,全程监控边坡状况。", "对现场进行封闭,落实告警阻拦措施;对灾毁周边稳定性进行评估,划定作业区与危险区,设立观察哨,全程监控边坡状态。",
}, },
{ {
id: 2, id: 2,
number: "②", number: "②",
title: "边坡排险", title: "边坡排险",
content: content:
"在确保安全的前提下,使用长臂挖掘机或人工在安全地域进行清除工作。注意下方施救作业。", "在确保安全的前提下,使用长臂挖掘机或人工在安全绳保护下对坡面上已松动、悬空的岩石和土体进行清除,注意下方暂停作业。",
}, },
{ {
id: 3, id: 3,
number: "③", number: "③",
title: "梯形清方", title: "梯形清方",
content: content:
'按照机械自上而下,装载机抢先挖入土石堆入车,确土车上车主生,增土车队运输,将受阻路段疏通清理通道。确保抢险不停工,形成高效的"挖一装一运"循环。', '挖掘机在最前方、负责将塌方体挖松,装载机将土石料装入渣土车,渣土车编队运输,将废料运至指定弃渣场。确保挖掘机、装载机、渣土车数量匹配,形成高效的"挖一装一运"循环。',
}, },
{ {
id: 4, id: 4,
number: "④", number: "④",
title: "开辟工作面", title: "开辟工作面",
content: content:
"根据地质情况而规划车,利用挖掘机、装载机完成设备增加的工作面。增加作业效率。", "根据抢通和救援要求,利用挖掘机、装载机或无人设备开辟新的工作面,增加作业效率。",
}, },
{ {
id: 5, id: 5,
number: "⑤", number: "⑤",
title: "交通疏导", title: "交通疏导",
content: content:
"清理出足够疏散车辆的临时性通道,临时道路根据道路情况设置限量所制路牌。在应急抢险下,试行错位通车。", "清理出足够疏散车辆的临时性通道,临时通道边缘用锥桶或沙袋进行警示和防护,在现场指挥下,放行积压车辆。",
}, },
{ {
id: 6, id: 6,
number: "⑥", number: "⑥",
title: "全断面抢通", title: "全断面抢通",
content: "将剩余集聚废弃物的清理清除,恢复道路原貌状。", content: "将剩余塌方体彻底清理,恢复路面原状。",
}, },
]); ]);
@ -305,14 +325,16 @@ const dispatchPlans = ref([
id: 1, id: 1,
stationName: "", // stations stationName: "", // stations
resources: [ resources: [
{ label: "轮播挖掘机挖掘机", value: "1台" }, { label: "轮挖掘机", value: "1台" },
{ label: "平板拖车", value: "1台" }, { label: "平板拖车", value: "1台" },
{ label: "自卸货车", value: "4台" }, { label: "自卸货车", value: "4台" },
{ label: "工程车", value: "1台" }, { label: "工程车", value: "1台" },
{ label: "装载机", value: "1台" },
{ label: "人员", value: "15人" }, { label: "人员", value: "15人" },
{ label: "锥桶", value: "30件" },
{ label: "铁锹", value: "10件" },
{ label: "雪糕筒", value: "50件" },
{ label: "标志标牌", value: "5块" }, { label: "标志标牌", value: "5块" },
{ label: "铁锹", value: "30件" },
{ label: "铁镐", value: "10件" },
{ label: "麻袋、砂石袋等", value: "若干" }, { label: "麻袋、砂石袋等", value: "若干" },
], ],
}, },
@ -320,14 +342,16 @@ const dispatchPlans = ref([
id: 2, id: 2,
stationName: "", stationName: "",
resources: [ resources: [
{ label: "轮播挖掘机挖掘机", value: "1台" }, { label: "轮挖掘机", value: "1台" },
{ label: "平板拖车", value: "1台" }, { label: "平板拖车", value: "1台" },
{ label: "自卸货车", value: "4台" }, { label: "自卸货车", value: "4台" },
{ label: "工程车", value: "1台" }, { label: "工程车", value: "1台" },
{ label: "人员", value: "15人" }, { label: "装载机", value: "15台" },
{ label: "人员", value: "5人" },
{ label: "锥桶", value: "30件" },
{ label: "铁锹", value: "10件" },
{ label: "雪糕筒", value: "50件" },
{ label: "标志标牌", value: "5块" }, { label: "标志标牌", value: "5块" },
{ label: "铁锹", value: "30件" },
{ label: "铁镐", value: "10件" },
{ label: "麻袋、砂石袋等", value: "若干" }, { label: "麻袋、砂石袋等", value: "若干" },
], ],
}, },
@ -337,7 +361,7 @@ const dispatchPlans = ref([
* 后续处治文本 * 后续处治文本
*/ */
const followUpText = ref( const followUpText = ref(
'将该处于方案大部分障碍清点,设置"注意落石"等标志牌,进行巡逻管控,进行巡逻处理信号监测统设备。' "将该处作为重大涉灾隐患点,设置“注意落石、观察通行”等标志,进行提级管控,进行边坡治理或设置监测预警设备。"
); );
/** /**
@ -384,7 +408,7 @@ watch(
*/ */
const handleAddPlan = () => { const handleAddPlan = () => {
// //
return return;
console.log("[EmergencyPlanContent] 点击新增预案"); console.log("[EmergencyPlanContent] 点击新增预案");
const newId = Math.max(...dispatchPlans.value.map((p) => p.id)) + 1; const newId = Math.max(...dispatchPlans.value.map((p) => p.id)) + 1;
const newIndex = dispatchPlans.value.length; const newIndex = dispatchPlans.value.length;
@ -393,14 +417,16 @@ const handleAddPlan = () => {
id: newId, id: newId,
stationName: getStationNameByIndex(newIndex), stationName: getStationNameByIndex(newIndex),
resources: [ resources: [
{ label: "轮播挖掘机挖掘机", value: "1台" }, { label: "轮挖掘机", value: "1台" },
{ label: "平板拖车", value: "1台" }, { label: "平板拖车", value: "1台" },
{ label: "自卸货车", value: "4台" }, { label: "自卸货车", value: "4台" },
{ label: "工程车", value: "1台" }, { label: "工程车", value: "1台" },
{ label: "人员", value: "15人" }, { label: "装载机", value: "15台" },
{ label: "人员", value: "5人" },
{ label: "锥桶", value: "30件" },
{ label: "铁锹", value: "10件" },
{ label: "雪糕筒", value: "50件" },
{ label: "标志标牌", value: "5块" }, { label: "标志标牌", value: "5块" },
{ label: "铁锹", value: "30件" },
{ label: "铁镐", value: "10件" },
{ label: "麻袋、砂石袋等", value: "若干" }, { label: "麻袋、砂石袋等", value: "若干" },
], ],
}); });
@ -411,7 +437,7 @@ const handleAddPlan = () => {
*/ */
const handleDeletePlan = (id) => { const handleDeletePlan = (id) => {
// //
return return;
console.log("[EmergencyPlanContent] 删除预案", id); console.log("[EmergencyPlanContent] 删除预案", id);
const index = dispatchPlans.value.findIndex((p) => p.id === id); const index = dispatchPlans.value.findIndex((p) => p.id === id);
if (index > -1) { if (index > -1) {
@ -716,6 +742,8 @@ const handleDeletePlan = (id) => {
line-height: 1.6; line-height: 1.6;
padding: vh(8) vw(12); padding: vh(8) vw(12);
transition: box-shadow 0.3s ease; transition: box-shadow 0.3s ease;
overflow: hidden !important;
// resize: none !important;
&:hover { &:hover {
box-shadow: 0 0 0 1px var(--primary-color) inset !important; box-shadow: 0 0 0 1px var(--primary-color) inset !important;

View File

@ -82,8 +82,10 @@ export function useDisasterData() {
{ {
id: 1, id: 1,
source: '气象预警', source: '气象预警',
// content:
// `忠县气象台${getCurrentDate()} 08:30分升级发布"暴雨黄色预警信号"过去6小时文峰、红池坝、天元、长桂等乡镇累计降雨量已达70毫米以上。`,
content: content:
`忠县气象台${getCurrentDate()} 08:30分升级发布"暴雨黄色预警信号"过去6小时文峰、红池坝、天元、长桂等乡镇累计降雨量已达70毫米以上。`, `忠县气象台2025-11-19 08:30分升级发布"暴雨黄色预警信号"过去6小时文峰、红池坝、天元、长桂等乡镇累计降雨量已达70毫米以上。`,
timestamp: getCurrentDateTime('08:30') timestamp: getCurrentDateTime('08:30')
}, },
{ {
@ -95,8 +97,10 @@ export function useDisasterData() {
{ {
id: 3, id: 3,
source: '融媒体中心', source: '融媒体中心',
// content:
// `发布了阻断信息巴南S204武大线三湾于${getCurrentDateWithoutYear()}发生山体滑坡,边坡有继续垮塌风险,需断道观察,车辆从桥口坝绕行金田村,预计${getCurrentDate()} 24:00恢复通行。`,
content: content:
`发布了阻断信息巴南S204武大线三湾于${getCurrentDateWithoutYear()}发生山体滑坡,边坡有继续垮塌风险,需断道观察,车辆从桥口坝绕行金田村,预计${getCurrentDate()} 24:00恢复通行。`, `发布了阻断信息巴南S204武大线三湾于11月19日发生山体滑坡,边坡有继续垮塌风险,需断道观察,车辆从桥口坝绕行金田村,预计2025-11-19 24:00恢复通行。`,
timestamp: getCurrentDateTime('24:00') timestamp: getCurrentDateTime('24:00')
} }
]) ])

View File

@ -47,6 +47,13 @@ export function useForceDispatch() {
}, },
{ {
id: 2, id: 2,
name: '挖掘机-002',
type: '挖掘机',
distance: 1.2,
status: 'ready'
},
{
id: 3,
name: '运输车-002', name: '运输车-002',
type: '运输车', type: '运输车',
distance: 0.8, distance: 0.8,
@ -63,13 +70,6 @@ export function useForceDispatch() {
battery: 85, battery: 85,
status: 'flying' status: 'flying'
}, },
{
id: 2,
name: '无人机-002',
altitude: 100,
battery: 92,
status: 'flying'
}
]) ])
// 切换标签页 // 切换标签页

View File

@ -46,7 +46,7 @@ export const VIDEO_MONITORS = [
{ {
id: 3, id: 3,
type: VIDEO_TYPES.VEHICLE_EXTERNAL, type: VIDEO_TYPES.VEHICLE_EXTERNAL,
title: '指挥车外部视角', title: '设备操作视角',
videoSrc: videoSrc:
'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/demo/ylzg/指挥车外部视角.mp4', 'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/demo/ylzg/指挥车外部视角.mp4',
dateRange: '2025/9/1-2025/12/1', dateRange: '2025/9/1-2025/12/1',
@ -58,7 +58,7 @@ export const VIDEO_MONITORS = [
{ {
id: 4, id: 4,
type: VIDEO_TYPES.VEHICLE_MEETING, type: VIDEO_TYPES.VEHICLE_MEETING,
title: '指挥会议视角', title: '指挥会议视角',
videoSrc: videoSrc:
'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/demo/ylzg/指挥车会议视角.mp4', 'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/demo/ylzg/指挥车会议视角.mp4',
dateRange: '2025/9/1-2025/12/1', dateRange: '2025/9/1-2025/12/1',
@ -79,9 +79,9 @@ export const DIRECTIONS = {
// 现场设备标签页 // 现场设备标签页
export const DISPATCH_TABS = [ export const DISPATCH_TABS = [
{ key: 'personnel', label: '现场单兵', count: 23 }, { key: 'personnel', label: '现场单兵', count: 3 },
{ key: 'equipment', label: '现场设备', count: 21 }, { key: 'equipment', label: '现场设备', count: 3 },
{ key: 'drone', label: '现场无人机', count: 21 }, { key: 'drone', label: '现场无人机', count: 1 },
] ]
// 响应等级 // 响应等级