同步6/16

src/views/system/HandleLog/index.vue

@@ -20,19 +20,6 @@
     <el-card class="flex-1" shadow="never">
       <template #header>
         <el-row :gutter="10" class="mb8">
-          <!-- <el-col :span="1.5">
-            <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['repair:add:handlelog']">新增</el-button>
-          </el-col>
-          <el-col :span="1.5">
-            <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['repair:edit:handlelog']"
-              >修改</el-button
-            >
-          </el-col>
-          <el-col :span="1.5">
-            <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['handleLog:handleLog:remove']"
-              >删除</el-button
-            >
-          </el-col> -->
           <right-toolbar
             :disable-delete="multiple"
             :disable-edit="single"
@@ -55,12 +42,17 @@
         </el-table-column>
         <el-table-column label="求助人" align="center" prop="seekName" width="120" />
         <el-table-column label="联系方式" align="center" prop="phone" width="120" />
+        <el-table-column label="办事地点" align="center" prop="handlePosition" />
         <el-table-column label="办事时间" align="center" prop="handleTime" width="120">
           <template #default="scope">
             <span>{{ parseTime(scope.row.handleTime, '{y}-{m}-{d}') }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="办事地点" align="center" prop="handlePosition" />
+        <el-table-column label="附属材料" width="100" align="center" prop="handlePosition">
+          <template #default="scope">
+            <el-button type="primary" @click="openDiage(scope.row)" link>点击查看</el-button>
+          </template>
+        </el-table-column>
         <el-table-column label="操作" width="200" align="center" fixed="right" class-name="small-padding fixed-width">
           <template #default="scope">
             <el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['handleLog:handleLog:edit']">编辑</el-button>
@@ -70,6 +62,22 @@
       </el-table>
 
       <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+      <!-- 添加或修改办事记录对话框 -->
+      <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
+        <ul class="ulbox" v-if="dialog.files.length > 0">
+          <li @click="handleDown(item)" class="files_item" v-for="(item, index) in dialog.files" :key="index">
+            <div>
+              {{ item.fileName }}
+            </div>
+            <span class="clickdown">点击下载</span>
+          </li>
+        </ul>
+        <ul class="ulbox" v-else>
+          <li class="files_item_no">
+            <div>暂无数据</div>
+          </li>
+        </ul>
+      </el-dialog>
     </el-card>
   </div>
 </template>
@@ -123,10 +131,14 @@ const { queryParams, form, rules } = toRefs(data);
 /** 查询办事记录列表 */
 const getList = async () => {
   loading.value = true;
-  const res = await listHandleLog(queryParams.value);
-  handleLogList.value = res.rows;
-  total.value = res.total;
-  loading.value = false;
+  listHandleLog(queryParams.value)
+    .then((res) => {
+      handleLogList.value = res.rows;
+      total.value = res.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
 };
 
 /** 搜索按钮操作 */
@@ -158,7 +170,7 @@ const handleAdd = () => {
 
 /** 修改按钮操作 */
 const handleUpdate = async (row?: HandleLogVO) => {
-  const _id = row.id || ids.value[0];
+  const _id = row ? row.id : ids.value[0];
   router.push({
     path: '/repair/editHandleLog',
     query: {
@@ -175,7 +187,21 @@ const handleDelete = async (row?: HandleLogVO) => {
   proxy?.$modal.msgSuccess('删除成功');
   await getList();
 };
+const dialog = reactive({
+  visible: false,
+  title: '',
+  files: []
+});
 
+const openDiage = (row) => {
+  dialog.visible = true;
+  dialog.title = '查看附属材料';
+  console.log(row);
+  dialog.files = row.handleLogFileList ?? [];
+};
+const handleDown = (item) => {
+  proxy?.$download.oss(item.ossId);
+};
 onMounted(() => {
   getList();
 });
@@ -185,4 +211,36 @@ onMounted(() => {
 .el-table {
   height: calc(100% - 80px);
 }
+.ulbox {
+  max-height: 300px;
+  overflow-y: auto;
+  overflow-x: hidden;
+}
+.files_item_no {
+  text-align: center;
+  color: #999;
+  padding: 10px;
+}
+.files_item {
+  height: 40px;
+  line-height: 40px;
+  box-sizing: border-box;
+  padding: 0 10px;
+  cursor: pointer;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  &:hover {
+    background-color: #f5f5f5;
+    color: #409eff;
+    .clickdown {
+      color: #409eff;
+    }
+  }
+
+  .clickdown {
+    color: #cccc;
+    font-size: small;
+  }
+}
 </style>