Explorar el Código

合规性判定页面搭建

maxiaoxiao hace 1 mes
padre
commit
aa73db5d8e
Se han modificado 1 ficheros con 247 adiciones y 0 borrados
  1. 247 0
      src/views/remote/farmland/components/hgxdialog.vue

+ 247 - 0
src/views/remote/farmland/components/hgxdialog.vue

@@ -0,0 +1,247 @@
+<template>
+  <!-- 审核详情 -->
+  <el-dialog :title="diatitle" v-model="open" width="650px" append-to-body>
+    <el-form
+      ref="dkjbxxRef"
+      :model="hgxform"
+      :rules="rules"
+      label-width="100px"
+    >
+      <el-row>
+        <el-col :span="16">
+          <el-form-item label="图斑编号:"> {{ hgxform.dkbh }} </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="监测面积(亩):">
+            {{ hgxform.dkmj }}
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="是否拆分:" prop="splitType">
+        <el-radio-group v-model="hgxform.splitType" :disabled="!action">
+          <el-radio label="0" size="large">是</el-radio>
+          <el-radio label="1" size="large">否</el-radio>
+        </el-radio-group>
+        <div class="splitbtns" v-if="!hgxform.splitType">
+          <el-button type="primary">上传拆分数据</el-button>
+          <el-button type="primary">在线拆分</el-button>
+          <el-button type="primary">清除</el-button>
+        </div>
+      </el-form-item>
+      <tablePage
+        v-if="!hgxform.splitType"
+        :cloumn="VoHeader"
+        :table="{ total: 20, data: hgxform.hgxVoList }"
+        :indexed="false"
+        :check="false"
+        layout=""
+      >
+        <template #action="{ row, $index }">
+          <el-select v-model="row.decide" placeholder="请选择">
+            <el-option
+              v-for="dict in hgx_decide"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            ></el-option>
+          </el-select>
+        </template>
+        <template #decideType="{ row }">
+          <el-tree-select
+            v-model="row.decideType"
+            :data="deptOptions"
+            :props="{
+              value: 'deptId',
+              label: 'deptName',
+              children: 'children',
+            }"
+            value-key="deptId"
+            check-strictly
+          />
+        </template>
+        <template #vaction="{ row }">
+          <span class="usable" @click="fly(row)">定位</span>
+        </template>
+      </tablePage>
+      <el-form-item label="判定结论:" prop="decide" :disabled="!action">
+      </el-form-item>
+      <el-form-item
+        label="违法类型/合法情形:"
+        prop="decideType"
+        :disabled="!action"
+      >
+      </el-form-item>
+      <el-form-item label=""> </el-form-item>
+      <el-form-item label="其他说明:" prop="notes" :disabled="!action">
+        <el-input
+          v-model="hgxform.notes"
+          type="textarea"
+          placeholder="请输入内容"
+        />
+      </el-form-item>
+      <el-form-item label="附件材料:">
+        <el-upload
+          multiple
+          :action="uploadFileUrl"
+          :file-list="hgxform.fjs"
+          :limit="10"
+          :on-error="handleUploadError"
+          :on-success="handleUploadSuccess"
+          :show-file-list="false"
+          :headers="headers"
+          class="upload-file"
+          ref="fileUpload"
+        >
+          <el-button type="primary">上传</el-button>
+        </el-upload>
+      </el-form-item>
+      <tablePage
+        :cloumn="fileHeader"
+        :table="{ total: 20, data: hgxform.fjs }"
+        :indexed="false"
+        :check="false"
+        layout=""
+      >
+        <template #faction="{ row, $index }">
+          <span class="usable" @click="preview(row)">查看</span>
+          <span class="usable" @click="download(row)"> 下载 </span>
+          <span class="usable" @click="handleDelete($index)"> 删除 </span>
+        </template>
+      </tablePage>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="open = false">取 消</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup name="details">
+import { getToken } from "@/utils/auth";
+
+import { hgxinfo, hgxDkjbxx } from "@/api/rsmonitoring/dkjbxx";
+const emit = defineEmits(["reset"]);
+const { proxy } = getCurrentInstance();
+const uploadFileUrl = ref(
+  import.meta.env.VITE_APP_BASE_API + "/file/upload/v1"
+);
+const headers = ref({ Authorization: "Bearer " + getToken() });
+const VoHeader = ref([
+  { label: "图斑支号", prop: "sort", align: "center" },
+  { label: "面积(亩)", prop: "area", width: "80px" },
+  { label: "合法性判定", slot: "decide", width: "120px" },
+  { label: "违法类型/合法情形", slot: "decideType", width: "120px" },
+  { label: "说明", prop: "notes", width: "120px" },
+  { label: "操作", slot: "vaction", width: "120px", align: "center" },
+]);
+const fileHeader = ref([
+  { label: "文件名称", prop: "fjName", align: "center" },
+  { label: "文件格式", prop: "fjType", width: "120px" },
+  { label: "文件大小(M)", prop: "fjSize", width: "120px" },
+  { label: "操作", slot: "faction", width: "120px", align: "center" },
+]);
+const resultdata = reactive({
+  open: false,
+  action: false,
+  diatitle: "",
+  hgxform: { hgxVoList: [], fjs: [] },
+});
+
+const { open, action, diatitle, hgxform } = toRefs(resultdata);
+function moreAct(actitem, infoObj) {
+  diatitle.value = `合法性判定结果`;
+  open.value = true;
+  action.value = false;
+  let pram = {
+    dkid: infoObj.id,
+    auditflowStep: actitem.auditflowStep,
+    auditflowId: actitem.id,
+  };
+  hgxinfo(pram).then((res) => {
+    hgxform.value = res.data || {};
+  });
+}
+function operate(infoObj, aStep) {
+  diatitle.value = `合法性判定`;
+  open.value = true;
+  action.value = true;
+  hgxform.value.dkjbxxId = infoObj.id;
+  hgxform.value.dkbh = infoObj.dkbh;
+  hgxform.value.dkmj = infoObj.dkmj;
+  hgxform.value.auditflowStep = aStep;
+
+  // } else if (oname == "002")
+  //   scDkjbxx(pram).then((res) => {
+  //     hgxform.value = res.data || {};
+  //   });
+  // else if (oname == "003")
+  //   tjDkjbxx(pram).then((res) => {
+  //     hgxform.value = res.data || {};
+  //   });
+}
+
+// 审核;
+function submitForm() {
+  if (!action.value) {
+    open.value = false;
+    return;
+  }
+  proxy.$refs["dkjbxxRef"].validate((valid) => {
+    if (valid) {
+      hgxDkjbxx(hgxform.value).then((res) => {
+        proxy.$modal.msgSuccess("合法性判定成功");
+        open.value = false;
+        reset();
+        emit("reset");
+      });
+    }
+  });
+}
+function reset() {
+  hgxform.value = {};
+}
+function download(row) {
+  window.open(row.fjPath);
+}
+function preview(row) {
+  window.open(row.fjPath, "_blank");
+}
+defineExpose({ moreAct, operate });
+
+// 上传失败
+function handleUploadError(err) {
+  proxy.$modal.msgError("上传文件失败");
+}
+function handleUploadSuccess(res, file, UploadFile, uploadFiles) {
+  if (res.code === 200) {
+    hgxform.value.fjs.push({
+      fjName: file.name,
+      fjPath: res.data.url,
+      // url: res.data.path,
+      fjSize: Number((file.size / 1024 / 1024).toFixed(2)),
+      fjType: file.name.split(".").pop(),
+    });
+    proxy.$modal.closeLoading();
+  } else {
+    // number.value--;
+    proxy.$modal.closeLoading();
+    proxy.$modal.msgError(res.msg);
+    proxy.$refs.fileUpload.handleRemove(file);
+    // uploadedSuccessfully();
+  }
+}
+function handleDelete(index) {
+  hgxform.value.fjs.splice(index, 1);
+}
+</script>
+
+<style>
+.splitbtns {
+  margin-left: 30px;
+}
+.upload-file {
+  display: inline-block;
+}
+</style>