完成访客搭建，完善之前审核界面

2026-04-13 18:10:23 +08:00
parent d957d1a039
commit 7f152c45f5
34 changed files with 1732 additions and 1208 deletions
--- a/src/views/system/Repair/addRepair.vue
+++ b/src/views/system/Repair/addRepair.vue
@@ -95,8 +95,11 @@ import { convertBuildingToTree, hasFormData } from '@/utils/house';
 import Holder from '@/components/Holder/index.vue';
 import { UploadProps, UploadUserFile } from 'element-plus';
 import { addRepair, getRepair, updateRepair, uploadRepairImages } from '@/api/system/Repair';
-import { getRepairProject, gettreelistRepairProject } from '@/api/system/RepairProject';
+import { gettreelistRepairProject } from '@/api/system/RepairProject';
+import { useHouseStore } from '@/store/modules/house';

+const houseStore = useHouseStore();
+const { treedata } = storeToRefs(houseStore);
 const uploadUrl = import.meta.env.VITE_APP_BASE_API + '/repair/uploadImages';

 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -127,41 +130,32 @@ const rules = ref({
 const userid = ref(null);
 // 当前小区
 const currentviliage = ref();
-// 树形结构
-const treedata = ref();
 // 报修项目 tree 结构
 const maintenanceItemTreeData = ref();
 function init() {
-  getCommunitylistAPI().then((res) => {
-    currentviliage.value = res.rows.find((item) => item.choiceStatus === 0);
-    getVillageTree(currentviliage.value.villageId).then((res) => {
-      treedata.value = convertBuildingToTree(res.data.buildings);
-    });
-
-    gettreelistRepairProject().then((res) => {
-      maintenanceItemTreeData.value = res.data;
-      if (route.query.id) {
-        userid.value = route.query.id;
-        form.value.id = userid.value;
-        getRepair(userid.value).then((res) => {
-          form.value = {
-            ...form.value,
-            ...res.data
-          };
-          fileList.value = form.value.problemImageUrl
-            .split(',')
-            .map((item) => {
-              if (!item) return undefined;
-              return {
-                name: item.split('/').pop(),
-                url: item
-              };
-            })
-            .filter((item) => item);
-          console.log(fileList.value);
-        });
-      }
-    });
+  gettreelistRepairProject().then((res) => {
+    maintenanceItemTreeData.value = res.data;
+    if (route.query.id) {
+      userid.value = route.query.id;
+      form.value.id = userid.value;
+      getRepair(userid.value).then((res) => {
+        form.value = {
+          ...form.value,
+          ...res.data
+        };
+        fileList.value = form.value.problemImageUrl
+          .split(',')
+          .map((item) => {
+            if (!item) return undefined;
+            return {
+              name: item.split('/').pop(),
+              url: item
+            };
+          })
+          .filter((item) => item);
+        console.log(fileList.value);
+      });
+    }
  });
 }
 init();
--- a/src/views/system/Repair/index.vue
+++ b/src/views/system/Repair/index.vue
@@ -60,27 +60,22 @@
        <el-table-column label="维修项目" align="center" prop="maintenanceItemPath" />
        <el-table-column label="问题描述" align="center" prop="problem" />
        <el-table-column label="报修人" align="center" prop="residentName" />
-        <el-table-column label="维修状态" align="center" prop="problemStatus">
-          <template #default="scope">
-            <dict-tag :options="com_repair_status" :value="scope.row.problemStatus"></dict-tag>
-          </template>
-        </el-table-column>
        <el-table-column label="预约日期" align="center" prop="orderDate" width="180">
          <template #default="scope">
            <span>{{ parseTime(scope.row.orderDate, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>
+        <el-table-column label="维修状态" align="center" prop="problemStatus">
+          <template #default="scope">
+            <dict-tag :options="com_repair_status" :value="scope.row.problemStatus || ''"></dict-tag>
+          </template>
+        </el-table-column>
+
        <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
          <template #default="scope">
-            <el-tooltip content="分配" placement="top">
-              <el-button link type="primary" icon="Pointer" @click="handleShare(scope.row)"></el-button>
-            </el-tooltip>
-            <el-tooltip content="修改" placement="top">
-              <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['repair:repair:edit']"></el-button>
-            </el-tooltip>
-            <el-tooltip content="删除" placement="top">
-              <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['repair:repair:remove']"></el-button>
-            </el-tooltip>
+            <el-button link type="primary" @click="handleShare(scope.row)">{{ scope.row.problemStatus === '0' ? '分配' : '详情' }}</el-button>
+            <el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['repair:repair:edit']">修改</el-button>
+            <el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['repair:repair:remove']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
--- a/src/views/system/Repair/repairMain.vue
+++ b/src/views/system/Repair/repairMain.vue
@@ -1,6 +1,6 @@
 <template>
  <div class="ResidentMainBox p-2 w-full">
-    <PageHeader title="车位详情"></PageHeader>
+    <PageHeader title="报修详情"></PageHeader>
    <div class="ResidentMainBody">
      <el-row :span="24" :gutter="20">
        <el-col :span="16">
@@ -9,8 +9,8 @@
            <el-card>
              <template #header>
                <div class="card-header">
-                  <span>车位信息</span>
-                  <el-button text type="primary">编辑</el-button>
+                  <span>报修房屋</span>
+                  <span class="ml-20px color-blue cursor-pointer" @click="handleEdit">编辑</span>
                </div>
              </template>
              <div class="w-full h-full CarinfoBox">
@@ -18,59 +18,44 @@
                  <el-col :span="8">
                    <div class="carinfo_item">
                      <div class="label">报修房屋</div>
-                      <div class="main">地下停车场A区</div>
+                      <div class="main">{{ form.house }}</div>
                    </div>
                  </el-col>
                  <el-col :span="8">
                    <div class="carinfo_item">
                      <div class="label">维修项目</div>
-                      <div class="main">地下停车场A区</div>
-                    </div>
-                  </el-col>
-                  <el-col :span="8">
-                    <div class="carinfo_item">
-                      <div class="label">问题描述</div>
-                      <div class="main">地下停车场A区</div>
+                      <div class="main">{{ form.maintenanceItem }}</div>
                    </div>
                  </el-col>
                </el-row>
+
                <el-row class="mb-20px">
                  <el-col :span="8">
                    <div class="carinfo_item">
                      <div class="label">报修人</div>
-                      <div class="main">地下停车场A区</div>
+                      <div class="main">{{ form.residentName }}</div>
                    </div>
                  </el-col>
                  <el-col :span="8">
                    <div class="carinfo_item">
                      <div class="label">手机号码</div>
-                      <div class="main">地下停车场A区</div>
-                    </div>
-                  </el-col>
-                  <el-col :span="8">
-                    <div class="carinfo_item">
-                      <div class="label">预约日期</div>
-                      <div class="main">地下停车场A区</div>
+                      <div class="main">{{ form.phone }}</div>
                    </div>
                  </el-col>
                </el-row>
                <el-row class="mb-20px">
-                  <el-col :span="8">
-                    <div class="carinfo_item">
-                      <div class="label">提交人</div>
-                      <div class="main">地下停车场A区</div>
-                    </div>
-                  </el-col>
-                  <el-col :span="8">
-                    <div class="carinfo_item">
-                      <div class="label">提交时间</div>
-                      <div class="main">地下停车场A区</div>
-                    </div>
-                  </el-col>
-                  <el-col :span="8">
+                  <el-col>
                    <div class="carinfo_item">
                      <div class="label">预约日期</div>
-                      <div class="main">地下停车场A区</div>
+                      <div class="main">{{ form.orderDate }}</div>
+                    </div>
+                  </el-col>
+                </el-row>
+                <el-row class="mb-20px">
+                  <el-col>
+                    <div class="carinfo_item">
+                      <div class="label">问题描述</div>
+                      <div class="main">{{ form.problem }}</div>
                    </div>
                  </el-col>
                </el-row>
@@ -79,7 +64,19 @@
                    <div class="carinfo_item">
                      <div class="label">附件</div>
                      <div class="main fileImagebox">
-                        <el-image class="carinfoImage"></el-image>
+                        <el-image
+                          :preview-teleported="true"
+                          :zoom-rate="1.2"
+                          :max-scale="7"
+                          :min-scale="0.2"
+                          :preview-src-list="form.problemImageUrlList"
+                          show-progress
+                          :initial-index="0"
+                          v-for="(item, index) in form.problemImageUrlList"
+                          :key="index"
+                          :src="item"
+                          class="carinfoImage"
+                        ></el-image>
                      </div>
                    </div>
                  </el-col>
@@ -100,8 +97,7 @@
                  <repairUser :userid="userid"></repairUser>
                </div>
                <div class="actions mt-5">
-                  <el-button type="primary">审核通过</el-button>
-                  <el-button type="danger">审核不通过</el-button>
+                  <el-button type="primary">确定派单</el-button>
                  <el-button>返回</el-button>
                </div>
              </div>
@@ -109,7 +105,7 @@
          </el-card>
        </el-col>
        <el-col :span="8">
-          <el-card style="position: relative">
+          <el-card style="position: relative; height: 100%">
            <template #header>
              <div class="asideCardHeader w-full">
                <div class="cardSubtitle">
@@ -118,7 +114,7 @@
                </div>
              </div>
            </template>
-            <div class="w-full h-50%">
+            <div class="h-full w-full">
              <el-steps space="108px" direction="vertical" :active="activeStop">
                <el-step>
                  <template #title>
@@ -156,14 +152,94 @@
 import { ref } from 'vue';
 import repairUser from '@/components/Holder/repairUser.vue';
 import PageHeader from '@/components/Pageheader/index.vue';
+import { getRepair } from '@/api/system/Repair';
+import { getCommunitylistAPI } from '@/api/system/community';
+import { getVillageTree } from '@/api/system/house';
+import { convertBuildingToTree, getHousePathById } from '@/utils/house';
+import { listRepairProject } from '@/api/system/RepairProject';
+import { listResident } from '@/api/system/resident';
+import { RepairVO } from '@/api/system/Repair/type';
+import { useHouseStore } from '@/store/modules/house';
+
+const houseStore = useHouseStore();
+const { treedata } = storeToRefs(houseStore);

 const route = useRoute();
+const router = useRouter();
 const active = ref(6);
 const activeStop = ref(4);

+interface formType extends RepairVO {
+  maintenanceItem?: string;
+  residentName?: string;
+  problemImageUrlList?: string[];
+  house?: string;
+}
+
+const form = ref<formType>({
+  'id': null,
+  'houseId': null,
+  'maintenanceItemId': null,
+  'problem': '',
+  'residentId': null,
+  'phone': null,
+  'orderDate': '',
+  'problemImageUrl': '',
+  'problemStatus': '0',
+  'repairDes': '',
+  'repairImageUrl': '',
+  'repairId': null
+});
 const userid = ref();
+
+// 维修项目
+const projectlist = ref([]);
+// 住户
+const residentList = ref([]);
+//  ! 房屋 ====================================================================================================
+async function init() {
+  // 项目
+  const projectres = await listRepairProject();
+  projectlist.value = projectres.rows;
+  // 住户
+  const residentlistres = await listResident();
+  residentList.value = residentlistres.rows;
+  // 报修详情
+  const res = await getRepair(userid.value);
+  form.value = res.data;
+  const find = projectlist.value.find((item) => item.id === form.value.maintenanceItemId);
+  if (find) {
+    if (find.parentId) {
+      const find2 = projectlist.value.find((item) => item.id === find.parentId);
+      form.value.maintenanceItem = find2.projectName + ' - ' + find.projectName;
+    } else {
+      form.value.maintenanceItem = find.projectName;
+    }
+  }
+
+  const houseinfo = getHousePathById(treedata.value, form.value.houseId, 'label');
+  console.log(treedata.value);
+
+  form.value.house = houseinfo.join(' - ');
+
+  const residentinfo = residentList.value.find((item) => item.id === form.value.residentId);
+  form.value.residentName = residentinfo.name;
+
+  form.value.problemImageUrlList = form.value.problemImageUrl.split(',').filter((item) => item);
+}
+
 if (route.query.id) {
  userid.value = route.query.id;
+  init();
+}
+
+function handleEdit() {
+  router.push({
+    path: '/repair/addRepair',
+    query: {
+      id: form.value.id
+    }
+  });
 }
 </script>

@@ -173,6 +249,7 @@ if (route.query.id) {
  flex-direction: column;
  .ResidentMainBody {
    margin-top: 20px;
+    flex: 1;
    .CarinfoBox {
      &.gridbox {
        display: grid;
@@ -192,8 +269,9 @@ if (route.query.id) {
          padding-right: 10px;
        }
        .carinfoImage {
+          margin: 10px;
          width: 200px;
-          height: 100px;
+          height: 150px;
        }
      }
    }
--- a/src/views/system/Repair/repairlist.vue
+++ b/src/views/system/Repair/repairlist.vue
@@ -81,12 +81,12 @@
        <el-table-column label="维修类名" align="center" prop="projectName" />
        <el-table-column label="项目类型" align="center" prop="projectType">
          <template #default="scope">
-            <dict-tag :options="com_repair_project_types" :value="scope.row.projectType"></dict-tag>
+            <dict-tag :options="com_repair_project_types" :value="scope.row.projectType || ''"></dict-tag>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" prop="status">
          <template #default="scope">
-            <dict-tag :options="com_repair_project_status" :value="scope.row.status"></dict-tag>
+            <dict-tag :options="com_repair_project_status" :value="scope.row.status || ''"></dict-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">