提交 审核、判定等操作的更多详情页面搭建，接口联调接入

src/views/remote/farmland/details.vue

@@ -1,14 +1,15 @@
 <template>
   <div class="details">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+    <!-- @tab-click="handleClick" -->
+    <el-tabs v-model="activeName">
       <el-tab-pane
         label="基本信息"
         name="jbxx"
-        v-if="!form || route.query.dataType != '2'"
+        v-if="!formde || route.query.dataType != '2'"
       >
-        <el-descriptions class="margin-top" :column="1">
+        <el-descriptions :column="1">
           <el-descriptions-item
-            v-for="(item, i) in jbxx"
+            v-for="(item, i) in jbxxs"
             :label="item.name"
             :key="i"
             >{{ infoObj[item.prop] }}
@@ -18,7 +19,7 @@
       <el-tab-pane
         label="业务研判"
         name="ywyp"
-        v-if="!form || route.query.dataType != '1'"
+        v-if="!formde || route.query.dataType != '1'"
       >
         <el-tabs v-model="ywyptab">
           <el-tab-pane label="土地利用现状" name="tdxz">
@@ -95,7 +96,7 @@
           </el-tab-pane>
         </el-tabs>
       </el-tab-pane>
-      <el-tab-pane label="核查信息" name="hcxx" v-if="!form">
+      <el-tab-pane label="核查信息" name="hcxx" v-if="!formde">
         共3次外业核查
         <el-collapse v-model="hcxxtab" @change="handleChange">
           <el-collapse-item v-for="(hcit, hi) in hcxxList" :key="hi" name="1">
@@ -113,7 +114,7 @@
           </el-collapse-item>
         </el-collapse>
       </el-tab-pane>
-      <el-tab-pane label="业务记录" name="ywjl" v-if="!form">
+      <el-tab-pane label="业务记录" name="ywjl" v-if="!formde">
         <el-timeline>
           <el-timeline-item
             v-for="(acti, index) in activities"
@@ -133,7 +134,7 @@
               <span
                 v-if="['001', '002', '003'].includes(acti.auditflowOperateType)"
                 class="time more"
-                @click="more"
+                @click="moreAct(acti)"
                 >更多</span
               >
             </div>
@@ -149,15 +150,53 @@
         </el-timeline>
       </el-tab-pane>
     </el-tabs>
+    <!-- 更多详情 -->
+    <el-dialog :title="diatitle" v-model="open" width="500px" append-to-body>
+      <!--  -->
+      <div>图斑编号：{{ resultform.dkbm }}</div>
+      <div>
+        <!-- audiText[resultform.auditflowOperateType].replace("合规性", "") -->
+        审核结论：{{}}
+      </div>
+      <div>审核说明：{{}}</div>
+      <div>
+        附件材料：
+        <tablePage
+          :cloumn="fileHeader"
+          :table="fileList"
+          :indexed="false"
+          :check="false"
+          layout=""
+        >
+          <template #action="{ row }">
+            <span class="usable" @click="preview(row)">查看</span>
+            <span class="usable" @click="download(row)"> 下载 </span>
+          </template>
+        </tablePage>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="open = false">确 定</el-button>
+          <!-- <el-button @click="open = false">取 消</el-button> -->
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
   
   <script setup name="details">
 import Hcxx from "./hcxx.vue";
 import { getDetailsDk } from "@/api/rsmonitoring/dataEntry";
-import { getDkjbxx, getAuditflow } from "@/api/rsmonitoring/dkjbxx";
 import {
-  jbxx,
+  getDkjbxx,
+  getAuditflow,
+  hgxinfo,
+  scinfo,
+  tjinfo,
+} from "@/api/rsmonitoring/dkjbxx";
+
+import {
+  jbxxs,
   tdxzTable,
   gtkjTable,
   gdTable,
@@ -169,8 +208,9 @@ import {
 const { proxy } = getCurrentInstance();
 const route = useRoute();
 const router = useRouter();
-const form = route.query.form == "dataEntry";
+const formde = ref(route.query.form == "dataEntry");
 const props = defineProps({});
+let nowObj = {};
 const data = reactive({
   activeName: "jbxx",
   ywyptab: "tdxz",
@@ -179,22 +219,71 @@ const data = reactive({
   activities: [],
 });
 
-const { activeName, ywyptab, infoObj, hcxxList, activities } = toRefs(data);
-
-function getDetails({ pcsjid, id }) {
-  if (form) {
+const { info, activeName, ywyptab, infoObj, hcxxList, activities } =
+  toRefs(data);
+const resultdata = reactive({
+  open: false,
+  diatitle: "",
+  resultform: {},
+  fileList: { total: 0, data: [{}] },
+  fileHeader: [
+    { label: "文件名称", prop: "bz", align: "center" },
+    { label: "文件格式", prop: "jc_date", width: "120px" },
+    { label: "文件大小(M)", prop: "jc_date", width: "120px" },
+    { label: "操作", slot: "action", align: "center" },
+  ],
+});
+const { open, diatitle, resultform, fileList, fileHeader } = toRefs(resultdata);
+function handleClick({ id }) {
+  if (formde.value) {
     getDetailsDk(id).then((res) => {
       infoObj.value = res.data;
     });
   } else {
+    // if (activeName.value == "jbxx")
     getDkjbxx(id).then((res) => {
       infoObj.value = res.data;
     });
+    // else if (activeName.value == "ywjl")
     getAuditflow({ dkjdxxId: id }).then((res) => {
       activities.value = res.data;
     });
   }
 }
+function getDetails({ pcsjid, id }) {
+  activeName.value = "jbxx";
+  infoObj.value = {};
+  activities.value = [];
+  // nowObj = { pcsjid, id };
+  handleClick({ pcsjid, id });
+}
+function moreAct(actitem) {
+  diatitle.value = `${actitem.auditflowStepValue}结果`;
+  open.value = true;
+  let pram = {
+    dkid: infoObj.value.id,
+    auditflowStep: actitem.auditflowStep,
+    auditflowId: actitem.id,
+  };
+  if (actitem.auditflowOperateType == "001")
+    hgxinfo(pram).then((res) => {
+      resultform.value = res.data || {};
+    });
+  else if (actitem.auditflowOperateType == "002")
+    scinfo(pram).then((res) => {
+      resultform.value = res.data || {};
+    });
+  else if (actitem.auditflowOperateType == "003")
+    tjinfo(pram).then((res) => {
+      resultform.value = res.data || {};
+    });
+}
+function download(row) {
+  window.open(`${window.axiosURI}/file/upload/attachment${row.path}`);
+}
+function preview(row) {
+  window.open(` ${window.axiosURI}/file/upload/inline${row.path}`, "_blank");
+}
 defineExpose({ getDetails });
 </script>
 <style scoped lang="scss">
@@ -234,5 +323,9 @@ defineExpose({ getDetails });
     overflow-x: hidden;
   }
 }
+.usable {
+  color: #3f93f5;
+  cursor: pointer;
+}
 </style>