feat: 恢复重建app 项目填报

packages/mobile/src/views/Rebuild/Rebuild.vue

@@ -5,20 +5,21 @@
         <CurrentSite />
 
         <div class="list-panel">
-            <CardItem v-for="(item, index) in list" :key="index" :title="`${item.area} ${item.rNumber} ${item.type}`"
+            <CardItem v-for="(item, index) in list" :key="index" :title="`${item.projectName}`"
                 @click="handleClickItem(item)">
                 <template #headerExtra>
-                    <van-tag v-if="item.status === '审批通过'" type="success" plain size="medium">{{ item.status }}</van-tag>
+                    <van-tag v-if="item.approvalStatus === 3 || item.approvalStatus === 1" type="success" plain size="medium">审批通过</van-tag>
-                    <van-tag v-else-if="item.status === '审批驳回'" type="danger" plain size="medium">{{ item.status
+                    <van-tag v-else-if="item.approvalStatus === 2 || item.approvalStatus === 4" type="danger" plain size="medium">审批驳回</van-tag>
-                    }}</van-tag>
+                    <van-tag v-else type="warning" plain size="medium">待审批</van-tag>
-                    <van-tag v-else type="warning" plain size="medium">{{ item.status }}</van-tag>
                 </template>
 
                 <div class="content">
                     <div class="left-info">
-                        <div><span class="label">起止桩号：</span><span class="value">{{ item.stationNumber }}</span></div>
+                        <div><span class="label">起止桩号：</span><span class="value">{{ `${item.startStakeNo} -
-                        <div><span class="label">路况位置：</span><span class="value">{{ item.position }}</span></div>
+                                ${item.endStakeNo}`}}</span>
-                        <div><span class="label">提交日期：</span><span class="value">{{ item.publishTime }}</span></div>
+                        </div>
+                        <div><span class="label">路况位置：</span><span class="value">{{ item.roadLocation }}</span></div>
+                        <div><span class="label">提交日期：</span><span class="value">{{ item.submitTime }}</span></div>
                     </div>
                     <div class="right-arrow" @click.stop="handleClickItem(item)">
                         <van-icon name="arrow" />
@@ -44,6 +45,7 @@ import SearchInput from '@/components/SearchInput.vue'
 import CurrentSite from '@/components/CurrentSite.vue'
 import CardItem from '@/components/CardItem.vue'
 import EmptyBox from '@/components/EmptyBox.vue'
+import { request } from "../../../../shared/utils/request";
 
 const router = useRouter()
 
@@ -52,44 +54,28 @@ onMounted(() => {
 })
 
 const getData = async () => {
+    const params = {
+        pageNum: 1,
+        pageSize: 999,
+    }
+    if (searchValue.value) {
+        params.districtName = searchValue.value
+    }
+    const res = await request({
+        url: '/snow-ops-platform/recovery/list',
+        method: 'GET',
+        params
+    })
+    if (res.code === '00000') {
+        list.value = res.data.records
+    }
 }
 
 // 搜索关键词
 const searchValue = ref('')
 
 // 预警列表数据
-const list = ref([
+const list = ref([])
-    {
-        id: 1,
-        area: '彭水',
-        rNumber: 'G211',
-        type: '发生水毁道路崩塌恢复重建',
-        stationNumber: 'K1674.16-1678.84',
-        position: '徐家镇村口南分叉路口',
-        publishTime: '2025-05-20',
-        status: '审批通过'
-    },
-    {
-        id: 2,
-        area: '巴南',
-        rNumber: 'S303',
-        type: '道路发生边坡坍塌',
-        stationNumber: 'K1674.16-1678.84',
-        position: '徐家镇村口南分叉路口',
-        publishTime: '2025-05-20',
-        status: '审批驳回'
-    },
-    {
-        id: 3,
-        area: '彭水',
-        rNumber: 'G211',
-        type: '道路崩塌改造工程',
-        stationNumber: 'K1674.16-1678.84',
-        position: '徐家镇村口南分叉路口',
-        publishTime: '2025-05-20',
-        status: '审批通过'
-    },
-])
 
 
 const handleClickBack = () => {
@@ -115,6 +101,10 @@ const handleAddDevice = () => {
     // });
 }
 
+watch(() => searchValue.value, () => {
+    getData()
+})
+
 
 </script>
 

packages/mobile/src/views/Rebuild/RebuildAdd.vue

@@ -2,34 +2,32 @@
     <PageContainer title="项目填报" @click-back="handleClickBack">
         <div class="content">
             <PanelItem>
-                <van-form label-align="left" colon>
+                <van-form ref="formRef" label-align="left" colon>
-                    <van-field v-model="form.name" label="区县名称" center placeholder="请填写" required
+                    <van-field v-model="form.project.districtName" label="区县名称" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写区县名称' }]" />
-                    <van-field v-model="form.name" label="线路编号" center placeholder="请填写" required
+                    <van-field v-model="form.project.routeNo" label="线路编号" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写线路编号' }]" />
-                    <van-field v-model="form.name" label="起点桩号" center placeholder="请填写" required
+                    <van-field v-model="form.project.startStakeNo" label="起点桩号" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写起点桩号' }]" />
-                    <van-field v-model="form.name" label="止点桩号" center placeholder="请填写" required
+                    <van-field v-model="form.project.endStakeNo" label="止点桩号" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写止点桩号' }]" />
-                    <van-field v-model="form.name" label="止点桩号" center placeholder="请填写" required
+                    <van-field v-model="form.project.implementMileage" label="实施里程" center placeholder="单位:公里" required
-                        :rules="[{ required: true, message: '请填写止点桩号' }]" />
+                        type="number" :rules="[{ required: true, message: '请填写实施里程' }]">
-                    <van-field v-model="form.number" label="实施里程" center placeholder="单位:公里" required type="number"
-                        :rules="[{ required: true, message: '请填写实施里程' }]">
                         <template #extra>
                             公里
                         </template>
                     </van-field>
-                    <van-field v-model="form.name" label="塌方及损失" center placeholder="(方/万元)" required
+                    <van-field v-model="form.project.earthworkLoss" label="塌方及损失" center placeholder="(方/万元)" required
                         :rules="[{ required: true, message: '请填写塌方及损失' }]" />
-                    <van-field v-model="form.name" label="灾害类型" center placeholder="请填写" required
+                    <van-field v-model="form.project.disasterType" label="灾害类型" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写灾害类型' }]" />
-                    <van-field v-model="form.name" label="地点路线" center placeholder="请填写" required
+                    <van-field v-model="form.project.locationRoute" label="地点路线" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写地点路线' }]" />
-                    <van-field v-model="form.name" label="路况位置" center placeholder="请填写" required
+                    <van-field v-model="form.project.roadLocation" label="路况位置" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写路况位置' }]" />
-                    <van-field v-model="form.name" label="阻断点小地名" center placeholder="请填写" required
+                    <van-field v-model="form.project.blockedPointName" label="阻断点小地名" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写阻断点小地名' }]" />
-                    <van-field v-model="form.name" label="恢复重建预估费用" center placeholder="请填写" required
+                    <van-field v-model="form.project.estimatedCost" label="恢复重建预估费用" center placeholder="请填写" required
                         :rules="[{ required: true, message: '请填写恢复重建预估费用' }]">
                         <template #extra>
                             万元
@@ -37,9 +35,8 @@
                     </van-field>
                     <van-field label="附件" center>
                         <template #input>
-                            <van-uploader v-model="fileList" @delete="handleDelete" name="photos" :file-list="fileList"
+                            <van-uploader v-model="fileList" @delete="handleDelete" name="files" :file-list="fileList"
-                                :file-type="['image/jpeg', 'image/png']" :after-read="afterRead" multiple
+                                accept=".png,.jpg,.mp4" :after-read="afterRead" multiple :max-count="6" />
-                                :max-count="6" />
                         </template>
                     </van-field>
                 </van-form>
@@ -56,17 +53,34 @@
 
 
 <script setup>
-import { ref, onMounted, watch } from 'vue'
+import { ref, onMounted, watch, reactive, toRaw } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import PageContainer from '@/components/PageContainer.vue'
 import { showToast, showLoadingToast } from "vant";
 import PanelItem from '@/components/PanelItem.vue'
+import { request } from "../../../../shared/utils/request";
 
 const router = useRouter()
 const route = useRoute()
 
-const form = ref({})
+const form = reactive({
+    project: {
+        districtName: null,
+        routeNo: null,
+        startStakeNo: null,
+        endStakeNo: null,
+        implementMileage: null,
+        earthworkLoss: null,
+        disasterType: null,
+        locationRoute: null,
+        roadLocation: null,
+        blockedPointName: null,
+        estimatedCost: null,
+    },
+    fileList: []
+})
 const fileList = ref([]);
+const formRef = ref();
 
 onMounted(() => {
     if (route.params.data) {
@@ -74,7 +88,7 @@ onMounted(() => {
         console.log('@@@@data', data);
         // todo 在有传参的时候 调用接口去获取数据 并且初始化表单
     } else {
-        console.log('无传入数据');
+        // console.log('无传入数据');
     }
 })
 
@@ -89,21 +103,21 @@ const handleClickBack = () => {
 // 文件删除
 const handleDelete = (file) => {
     if (file.serverUrl) {
-        const index = form.photos.findIndex((p) => p.photoUrl === file.serverUrl);
+        const index = form.fileList.findIndex((p) => p.fileUrl === file.serverUrl);
         if (index !== -1) {
-            form.photos.splice(index, 1);
+            form.fileList.splice(index, 1);
         }
     }
 };
 
 // 文件上传
 const afterRead = async (file) => {
+    const toast = showLoadingToast({
+        message: "上传中...",
+        forbidClick: true,
+        duration: 0, // 设置为0表示不会自动关闭
+    });
     try {
-        const toast = showLoadingToast({
-            message: "上传中...",
-            forbidClick: true,
-            duration: 0, // 设置为0表示不会自动关闭
-        });
         const formData = new FormData();
         formData.append("file", file.file);
         const res = await request({
@@ -113,14 +127,23 @@ const afterRead = async (file) => {
         });
         toast.close();
         if (res.code === "00000") {
-            form.photos.push({ photoUrl: res.data });
+            // 根据文件类型设置fileType: 1-图片 2-视频
+            console.log('file', file)
+            let fileTypeValue = 1; // 默认图片
+            if (file.file.type.startsWith('video/')) {
+                fileTypeValue = 2; // 视频
+            }
+            form.fileList.push({
+                fileUrl: res.data,
+                fileType: fileTypeValue,
+                fileName: file.file.name,
+            });
             const index = fileList.value.findIndex((f) => f.file === file.file);
             if (index !== -1) {
                 fileList.value[index].serverUrl = res.data;
             }
-
+            // console.log("form.fileList", toRaw(form.fileList));
-            console.log("form.photos", toRaw(form.photos));
+            // console.log("fileList.value", fileList.value);
-            console.log("fileList.value", fileList.value);
         } else {
             throw new Error(res.message);
         }
@@ -132,6 +155,45 @@ const afterRead = async (file) => {
         });
     }
 };
+
+
+const handleAdd = async () => {
+    // 先进行表单校验
+    if (!formRef.value) {
+        showToast('表单初始化失败');
+        return;
+    }
+
+    try {
+        const isValid = await formRef.value.validate();
+        // 表单校验通过，继续处理提交逻辑
+        const toast = showLoadingToast({
+            message: "上报中...",
+            forbidClick: true,
+            duration: 0, // 设置为0表示不会自动关闭
+        });
+        console.log('表单校验通过，提交数据:', form);
+
+        const res = await request({
+            url: '/snow-ops-platform/recovery/add',
+            method: 'POST',
+            data: form
+        })
+        toast.close();
+        if(res.code === '00000'){
+            showToast('提交成功');
+            handleClickBack();
+        }else{
+            showToast('提交失败, 请稍后重试或联系管理员');
+        }
+    } catch (error) {
+        // console.log('表单校验失败:', error);
+        showToast('请检查并完善表单信息');
+    }
+}
+
+
+
 </script>
 
 <style scoped lang="scss">