feat: 法规处响应预警值班管理

2026-04-15 15:55:25 +08:00 · 2026-04-15 15:55:25 +08:00 · 8f364eff26
commit 8f364eff26
parent c64ba68984
7 changed files with 493 additions and 6 deletions
--- a/packages/mobile/src/views/Rebuild/RebuildAdd.vue
+++ b/packages/mobile/src/views/Rebuild/RebuildAdd.vue
@ -121,8 +121,8 @@ const getDetail = async (id) => {
 onMounted(() => {
    if (route.params.data) {
        const data = JSON.parse(decodeURIComponent(route.params.data));
-        console.log('@@@@data', data);
-        // todo 在有传参的时候 调用接口去获取数据 并且初始化表单
+        // console.log('@@@@data', data);
+        //  在有传参的时候 调用接口去获取数据 并且初始化表单
        getDetail(data);
    } else {
        // console.log('无传入数据');
--- a/packages/screen/src/router/index.js
+++ b/packages/screen/src/router/index.js
@ -180,6 +180,16 @@ const routes = [
      parentRoute: 'warningManagement3'
    }
  },
+  {
+    path: '/dutyManagement',
+    name: 'dutyManagement',
+    component: () => import('../views/WarningManagement/law/dutyManagement/index.vue'),
+    meta: {
+      title: '值班管理',
+      breadcrumb: true,
+      parentRoute: 'warningManagement3'
+    }
+  },

  // 项目管理 - 区县
  {
--- a/packages/screen/src/views/WarningManagement/law/dutyManagement/addDialog.vue
+++ b/packages/screen/src/views/WarningManagement/law/dutyManagement/addDialog.vue
@ -0,0 +1,151 @@
+<template>
+  <div class="detail-container">
+    <el-form ref="formRef" :model="form" label-position="right" label-width="auto"
+      style="max-height: 60vh; overflow-y: auto; padding-right: 50px" :rules="rules">
+      <div class="form-part">
+        <el-row>
+          <h4 style="margin: 0 0 20px 0;">气象信息</h4>
+        </el-row>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="预警标题" prop="预警标题">
+              <el-input v-model="form.headline" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="预警时间" prop="预警时间">
+              <el-col :span="11">
+                <el-date-picker v-model="form.onset" type="date" placeholder="开始时间" style="width: 100%" />
+              </el-col>
+              <el-col :span="2" class="text-center">
+                <span class="text-gray-500">-</span>
+              </el-col>
+              <el-col :span="11">
+                <el-date-picker v-model="form.expires" type="date" placeholder="过期时间" style="width: 100%" />
+              </el-col>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="气象类型" prop="气象类型">
+              <el-select v-model="form.eventType" clearable placeholder="请选择">
+                <el-option v-for="(item, index) in [
+                  { label: '道路结冰', value: '道路结冰' },
+                  { label: '暴雪', value: '暴雪' },
+                  { label: '暴雨', value: '暴雨' },
+                ]" :key="index" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="气象来源" prop="气象来源">
+              <el-select v-model="form.weatherSource" clearable placeholder="请选择">
+                <el-option v-for="(item, index) in [
+                  { label: '市级', value: '1' },
+                  { label: '部级', value: '2' },
+                  { label: '区县', value: '3' },
+                ]" :key="index" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="预警等级" prop="预警等级">
+              <el-select v-model="form.urgency" clearable placeholder="请选择">
+                <el-option v-for="(item, index) in [
+                  { label: '1级（红色预警）', value: '1' },
+                  { label: '2级（橙色预警）', value: '2' },
+                  { label: '3级（黄色预警）', value: '3' },
+                  { label: '4级（蓝色预警）', value: '4' },
+                ]" :key="index" :label="item.label" :value="item.value" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <el-form-item label="风险区县" prop="风险区县">
+              <el-select v-model="form.areaCodes" clearable placeholder="请选择" multiple>
+                <el-option v-for="(item, index) in areaList" :key="index" :label="item.qxmc" :value="item.xzdm" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </div>
+
+    </el-form>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, watch, computed } from "vue";
+import { request } from "@/utils/request";
+import FileUpload from '@/component/FileUpload/FileUpload.vue'
+const formRef = ref(null);
+defineExpose({ formRef });
+
+const props = defineProps({
+  form: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+
+const areaList = ref([])
+
+// 获取区县列表
+const getAreaList = async () => {
+  try {
+    const res = await request({
+      url: '/snow-ops-platform/infrastructure-asset/counties',
+      method: 'get',
+    })
+    if (res.code === '00000') {
+      areaList.value = res.data
+    } else {
+      throw new Error(res.message)
+    }
+  } catch (error) {
+    ElMessage.error(error.message)
+    console.log(error)
+  }
+}
+
+onMounted(() => {
+  getAreaList()
+})
+
+const rules = computed(() => {
+  return {
+    // mc: [
+    //   {
+    //     required: true,
+    //     validator: (rule, value, callback) => {
+    //       if (props.form.mc) {
+    //         callback();
+    //       } else {
+    //         callback(new Error("请输入服务站名称"));
+    //       }
+    //     },
+    //     trigger: "blur",
+    //   },
+    // ],
+  };
+});
+</script>
+
+<style scoped>
+.form-part {
+  padding: 20px;
+}
+
+.text-center {
+  text-align: center;
+}
+</style>
--- a/packages/screen/src/views/WarningManagement/law/dutyManagement/index.js
+++ b/packages/screen/src/views/WarningManagement/law/dutyManagement/index.js
@ -0,0 +1,157 @@
+import { h, ref, onMounted, reactive, watch, toRaw, nextTick } from "vue";
+import { request } from "@/utils/request";
+import { useRoute, useRouter } from 'vue-router'
+import AddDialog from "./addDialog.vue";
+
+const tableData = ref([]); // 表格数据
+const modelVisible = ref(false); // 弹窗状态
+const drawerVisible = ref(false); // 抽屉状态
+// 弹窗内容
+const model = reactive({
+
+});
+const form = reactive({
+
+});
+const INIT_FORM = {
+
+};
+// 抽屉内容
+const drawer = reactive({
+    title: '',
+    content: null,
+    props: {},
+    onCancel: null,
+    onConfirm: null,
+    direction: 'rtl',
+    size: '50%'
+});
+const dialogRef = ref(null); // 弹窗实例
+const drawerRef = ref(null); // 抽屉实例
+
+const columns = [
+    {
+        prop: "userCount",
+        label: "值班人数",
+    },
+    {
+        prop: "startTime",
+        label: "开始时间",
+    },
+    {
+        prop: "endTime",
+        label: "结束时间",
+    },
+    {
+        prop: "createTime",
+        label: "排班时间",
+    },
+    {
+        prop: "createBy",
+        label: "排班人",
+    },
+]
+
+// 过滤条件
+const filterData = reactive({})
+// 分页
+const pagination = reactive({
+    current: 1,
+    pageSize: 10,
+    total: 0,
+    pageSizes: [10, 20, 50],
+    layout: "prev, pager, next, jumper",
+    onChange: (page, pageSize) => {
+        pagination.current = page;
+        pagination.pageSize = pageSize;
+        getTableData(filterData);
+    },
+});
+
+// 获取预警列表
+const getTableData = async (filterData = {}) => {
+    try {
+        // 过滤空字符串属性
+        const filteredParams = {};
+        Object.keys(filterData).forEach(key => {
+            if (filterData[key] !== '' && filterData[key] != null) {
+                filteredParams[key] = filterData[key];
+            }
+        });
+        const res = await request({
+            url: '/snow-ops-platform/law-duty/page',
+            method: "GET",
+            params: {
+                dutyStartTime: filteredParams.timeRange?.[0],
+                dutyEndTime: filteredParams.timeRange?.[1],
+                pageNum: pagination.current,
+                pageSize: pagination.pageSize,
+            }
+        })
+        if (res.code === '00000') {
+            tableData.value = res.data.records
+            pagination.total = res.data.total
+        } else {
+            throw new Error(res.message)
+        }
+    } catch (error) {
+        ElMessage.error('获取排班列表失败');
+        console.error('获取排班列表失败:', error);
+    }
+}
+
+// 打开发布预警弹窗
+const openAddDialog = () => {
+    model.title = '发布预警';
+    Object.assign(form, INIT_FORM);
+    model.props = {
+        form: form,
+    };
+    model.content = AddDialog;
+    model.onCancel = () => {
+        modelVisible.value = false;
+    };
+    model.onConfirm = async () => {
+        await dialogRef?.value?.dynamicComponentRef?.formRef.validate().then(async () => {
+            console.log('@@@@@发布预警', form);
+            // await publishWarning(form)
+        })
+            .catch((err) => {
+                ElMessage.error('请处理表单中的错误项');
+            });
+    };
+    model.width = "50%"
+    modelVisible.value = true;
+}
+
+export default () => {
+
+    const router = useRouter();
+
+    onMounted(() => {
+        getTableData();
+    })
+
+
+    watch(filterData, (val) => {
+        getTableData(filterData);
+    }, { deep: true })
+
+
+
+    return {
+        tableData,
+        filterData,
+
+        pagination,
+        columns,
+
+        modelVisible,
+        model,
+        drawerVisible,
+        drawer,
+        dialogRef,
+        drawerRef,
+        openAddDialog,
+    }
+}
--- a/packages/screen/src/views/WarningManagement/law/dutyManagement/index.vue
+++ b/packages/screen/src/views/WarningManagement/law/dutyManagement/index.vue
@ -0,0 +1,54 @@
+<template>
+    <div class="root">
+        <div class="search-box">
+            <el-date-picker v-model="script.filterData.timeRange" type="datetimerange" start-placeholder="值班开始时间"
+                end-placeholder="值班结束时间" style="width: 400px; margin-right: 10px" size="large"
+                format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD" time-format="hh:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" />
+        </div>
+        <div class="event-box">
+            <el-button type="primary" @click="">立即排班</el-button>
+            <!-- <el-button type="primary" @click="script.gotoLedgerPage">驻地台账</el-button> -->
+            <!-- <el-button type="primary" @click="script.openAddDialog">上报项目</el-button> -->
+        </div>
+        <DynamicTable :dataSource="script.tableData.value" :columns="script.columns" :autoHeight="true"
+            :pagination="script.pagination">
+
+        </DynamicTable>
+        <div class="model-box">
+            <MyDialog v-model="script.modelVisible.value" :title="script.model?.title"
+                :dynamicComponent="script.model?.content" :component-props="script.model?.props"
+                :onConfirm="script.model?.onConfirm" :onCancel="script.model?.onCancel" ref="dialogRef"
+                :width="script.model?.width">
+            </MyDialog>
+            <MyDrawer v-model="script.drawerVisible.value" :title="script.drawer?.title"
+                :dynamicComponent="script.drawer?.content" :component-props="script.drawer?.props"
+                :onConfirm="script.drawer?.onConfirm" :onCancel="script.drawer?.onCancel" ref="drawerRef"
+                :direction="script.drawer?.direction" :size="script.drawer?.size">
+            </MyDrawer>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import DynamicTable from "@/component/DynamicTable/index.js";
+import { Search, ArrowDown } from "@element-plus/icons-vue";
+import MyDialog from "@/component/MyDialog/index.js";
+import MyDrawer from "@/component/MyDrawer/index.js";
+import scriptFn from "./index.js";
+const script = scriptFn();
+const { dialogRef, drawerRef } = script;
+</script>
+
+<style scoped>
+.root {
+    height: 100%;
+    padding: 25px;
+}
+
+.event-box {
+    margin: 20px 0;
+    display: flex;
+    justify-content: flex-end;
+}
+</style>
--- a/packages/screen/src/views/WarningManagement/law/index.js
+++ b/packages/screen/src/views/WarningManagement/law/index.js
@ -17,9 +17,22 @@ const model = reactive({
    width: '',
 });
 const form = reactive({
+    headline: '',
+    onset: '',
+    expires: '',
+    eventType: '',
+    weatherSource: '',
+    urgency: '',
+    areaCodes: [],
 });
 const INIT_FORM = {
-
+    headline: '',
+    onset: '',
+    expires: '',
+    eventType: '',
+    weatherSource: '',
+    urgency: '',
+    areaCodes: [],
 };
 // 抽屉内容
 const drawer = reactive({
@ -200,8 +213,9 @@ const openAddDialog = () => {
        modelVisible.value = false;
    };
    model.onConfirm = async () => {
-        await dialogRef?.value?.dynamicComponentRef?.formRef.validate().then(() => {
-            console.log('@@@@@发布预警', form);
+        await dialogRef?.value?.dynamicComponentRef?.formRef.validate().then(async () => {
+            // console.log('@@@@@发布预警', form);
+            await publishWarning(form)
        })
            .catch((err) => {
                ElMessage.error('请处理表单中的错误项');
@ -211,6 +225,34 @@ const openAddDialog = () => {
    modelVisible.value = true;
 }

+// 发布预警
+const publishWarning = async (data) => {
+    try {
+        const loading = ElLoading.service({
+            lock: true,
+            text: '操作中',
+            background: 'rgba(0, 0, 0, 0.7)',
+        })
+        const res = await request({
+            url: '/snow-ops-platform/lawWeatherWarning/publish',
+            method: 'POST',
+            data
+        })
+        loading.close();
+        if (res.code === '00000') {
+            ElMessage.success('操作成功');
+            modelVisible.value = false;
+            getTableData(filterData);
+
+        } else {
+            throw new Error(res.message)
+        }
+    } catch (error) {
+        ElMessage.error('操作失败');
+        console.error('操作失败:', error);
+    }
+}
+
 // 打开详情弹窗
 const openDetailDrawer = (row) => {
    drawer.title = '预警详情';
@ -221,16 +263,67 @@ const openDetailDrawer = (row) => {
    drawerVisible.value = true;
 }

+// 上传线下帮扶
+const uploadFile = async (file) => {
+    if (!file) {
+        ElMessage.warning('请选择要上传的文件');
+        return;
+    }
+
+    try {
+        // 创建FormData对象
+        const formData = new FormData();
+        formData.append('file', file);
+
+        const loading = ElLoading.service({
+            lock: true,
+            text: '操作中',
+            background: 'rgba(0, 0, 0, 0.7)',
+        })
+
+        // 发送POST请求
+        const res = await request({
+            url: '/snow-ops-platform/fgc-xxbf/upload',
+            method: 'POST',
+            data: formData,
+            headers: {
+                'Content-Type': 'multipart/form-data'
+            }
+        });
+
+        // 关闭加载提示
+        loading.close();
+
+        if (res.code === '00000') {
+            ElMessage.success('文件上传成功');
+        } else {
+            throw new Error(res.message || '上传失败');
+        }
+    } catch (error) {
+        ElMessage.error(error.message || '文件上传失败');
+        console.error('文件上传失败:', error);
+    }
+}
+
+
+


 export default () => {

    const router = useRouter();
+    // 跳转到台账页面
    const gotoLedgerPage = () => {
        router.push({
            path: '/ledgerManagement3'
        });
    };
+    // 跳转到值班管理
+    const gotoDutyPage = () => {
+        router.push({
+            path: '/dutyManagement'
+        });
+    };

    onMounted(() => {
        getTableData();
@ -254,6 +347,7 @@ export default () => {
        pagination,
        columns,
        gotoLedgerPage,
+        gotoDutyPage,

        modelVisible,
        model,
@ -262,5 +356,7 @@ export default () => {
        dialogRef,
        drawerRef,
        openAddDialog,
+
+        uploadFile,
    }
 }
--- a/packages/screen/src/views/WarningManagement/law/index.vue
+++ b/packages/screen/src/views/WarningManagement/law/index.vue
@ -13,9 +13,12 @@
        <div class="event-box">
            <el-button type="primary" @click="">生成报告</el-button>
            <el-button type="primary" @click="script.openAddDialog">发布预警</el-button>
-            <!-- <el-button type="primary" @click="">上传线下帮扶</el-button> -->
+            <el-button type="primary" @click="triggerFileSelect">上传线下帮扶</el-button>
            <el-button type="primary" @click="script.gotoLedgerPage">线下帮扶台账</el-button>
+            <el-button type="primary" @click="">立即排班</el-button>
+            <el-button type="primary" @click="script.gotoDutyPage">值班管理</el-button>
            <el-button type="primary" color="#952DE6" @click="">导出</el-button>
+            <input type="file" ref="fileInput" style="display: none" @change="handleFileSelect" accept=".*"></input>
            <!-- <el-button type="primary" @click="script.gotoLedgerPage">驻地台账</el-button> -->
            <!-- <el-button type="primary" @click="script.openAddDialog">上报项目</el-button> -->
        </div>
@ -39,6 +42,7 @@
 </template>

 <script setup>
+import { ref } from 'vue';
 import DynamicTable from "../../../component/DynamicTable/index.js";
 import { Search, ArrowDown } from "@element-plus/icons-vue";
 import MyDialog from "../../../component/MyDialog/index.js";
@ -46,7 +50,22 @@ import MyDrawer from "../../../component/MyDrawer/index.js";
 import scriptFn from "./index.js";
 const script = scriptFn();
 const { dialogRef, drawerRef } = script;
+const fileInput = ref(null);

+// 触发文件选择
+const triggerFileSelect = () => {
+    fileInput.value.click();
+};
+
+// 处理文件选择
+const handleFileSelect = (event) => {
+    const file = event.target.files[0];
+    if (file) {
+        script.uploadFile(file);
+    }
+    // 清空input值，确保相同文件可以重复选择
+    event.target.value = '';
+};
 </script>

 <style scoped>