onemap-implementationSupervision-system-frontend/website/src/views/ghcgscygl/ghcgsb/Qxxb.vue

<template>
  <div class="qxyh max-box flex-box column">
    <div class="header flex-box align-center box-sizing">
      <div class="header-left">
        <el-form :inline="true" :model="formInline">
          <el-form-item label="标题:">
            <el-input v-model="formInline.subject"></el-input>
          </el-form-item>
          <el-form-item label="规划类型:" style="display: none">
            <el-select v-model="formInline.planType" placeholder="请选择">
              <el-option label="总体规划" value="1"></el-option>
              <el-option label="村庄规划" value="2"></el-option>
              <el-option label="报批项目" value="3"></el-option>
              <el-option label="总体规划（对部）" value="4"></el-option>
              <el-option label="详细规划" value="5"></el-option>
              <el-option label="专项规划" value="6"></el-option>
              <el-option label="乡镇苏木国土空间规划" value="7"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="行政区:">
            <el-cascader
              :options="xzoptions"
              :props="{
                ...props,
                checkStrictly: true,
                expandTrigger: 'hover',
              }"
              v-model="xzqCode"
              clearable
              ref="cascader"
              class="cascader-style"
              style="width: 90%"
              popper-class="popper-cascader"
              :filterable="true"
              @change="setXzqdm"
              :show-all-levels="false"
            ></el-cascader>
          </el-form-item>
          <el-button
            type="primary"
            @click="changeForm"
            style="margin-left: 20px"
            >查询</el-button
          >
        </el-form>
      </div>
    </div>
    <div class="table-layout flex-box column height-100-60">
      <div class="table max-width height-100-50">
        <el-table
          ref="multipleTable"
          :data="tableData"
          style="width: 100%"
          border
          fit
          cell-class-name="cell-item"
          height="100%"
          tooltip-effect="dark"
        >
          <el-table-column prop="id" label="记录主键" align="center">
          </el-table-column>
          <el-table-column prop="name" label="成果名称" align="center">
          </el-table-column>
          <el-table-column prop="instid" label="流程主键" align="center">
          </el-table-column>
          <el-table-column prop="xzqmc" label="行政区名称" align="center">
          </el-table-column>
          <el-table-column prop="uploadtime" label="提交时间" align="center">
          </el-table-column>
          <el-table-column prop="shzt" label="上报状态" align="center">
            <template #default="scope">
              <span>
                {{ getShzt(scope.row.shzt) }}
              </span>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            type="flex"
            justity="space-between"
            width="220"
          >
            <template #default="scope">
              <div class="">
                <el-button
                  type="primary"
                  size="mini"
                  @click="open(scope.row)"
                  style="display: inline-block"
                  >审批记录</el-button
                >
                <el-button
                  type="primary"
                  size="mini"
                  @click="xbUpload(scope.row)"
                  v-if="scope.row.shzt == '0'"
                  style="display: inline-block"
                  >修编</el-button
                >
                <el-button
                  type="primary"
                  size="mini"
                  @click="xbDownload(scope.row.id)"
                  v-if="scope.row.path"
                  style="display: inline-block"
                  >下载</el-button
                >
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div class="flex-box footer height-50 flex-box align-center box-sizing">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="formInline.current"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="formInline.size"
          background
          :pager-count="5"
          layout="total, sizes, prev, pager, next, jumper"
          :total="formInline.total"
        >
        </el-pagination>
      </div>
    </div>
    <ShjlDialog
      v-model:list="shjllist"
      v-model:ShjlDialog="shjlShow"
      v-if="shjlShow"
      style="margin-top: 300px"
    ></ShjlDialog>
    <GhcgDialog
      v-if="ztghDialog"
      v-model:ghcgscDialog="ztghDialog"
      :isCity="
        $store.getters.roles.join(',').indexOf('qixian') > -1 ? false : true
      "
      :instid="instid"
      @refresh="changeForm"
      @getlist="changeForm"
    ></GhcgDialog>
    <CzghcgDialog
      v-if="ghcgscDialog"
      v-model:ghcgscDialog="ghcgscDialog"
      :instid="instid"
      @refresh="changeForm"
      @getlist="changeForm"
    ></CzghcgDialog>
    <XxghcgDialog
      v-if="xxghcgscDialog"
      v-model:xxghcgscDialog="xxghcgscDialog"
      :instid="instid"
      @refresh="changeForm"
      @getlist="changeForm"
    ></XxghcgDialog>
    <el-dialog
      title="修编上传"
      v-model="dialogVisible"
      style="width: 360px; height: 300px"
      :before-close="handleClose"
      append-to-body
    >
      <div style="width: 100%; height: 100%">
        <el-form label-width="100px">
          <!-- <el-form-item label="选择文件">
            <el-upload
              ref="fileUploadBtn"
              :limit="1"
              :file-list="fileList"
              :on-change="handleChangeFile"
              :on-remove="handleRemove"
              :auto-upload="false"
              :show-file-list="true"
            >
              <el-button size="small" type="primary">点击上传</el-button>
            </el-upload>
          </el-form-item> -->
          <el-form-item label="主键id">
            <el-input readonly v-model="xbid" placeholder="主键id"></el-input>
          </el-form-item>
          <el-form-item label="流程主键">
            <el-input
              readonly
              v-model="instid"
              placeholder="请输入流程主键"
            ></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="xbSubmit()" size="small"
          >修编</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { reactive, toRefs, ref } from "@vue/reactivity";
import { getCurrentInstance, onMounted } from "@vue/runtime-core";
import {
  getLandMyAttendsData,
  getLandGetAllTasks,
  getLandTaskStatus,
  reportDownloadAction,
  getInstIds,
  getcgglInstIds,
  getLandGetRevisePageData,
  reuploadThirdpartyReviseData,
} from "@/api/ghcgysc/search.js";
import request from "@/utils/request.js";
import { getxblist } from "@/api/ghcgysc/cggl.js";
import ShjlDialog from "@/components/ghcgscygl/ghcgsb/search/Shjl.vue";
import GhcgDialog from "@/components/ghcgscygl/ghcgsb/ztgh/ghcgDialog.vue";
import CzghcgDialog from "@/components/ghcgscygl/ghcgsb/xxgh/czgh/Qxyh/czghcgDialog.vue";
import XxghcgDialog from "@/components/ghcgscygl/ghcgsb/xxgh/xxgh/Qxyh/czghcgDialog.vue";
import { ElMessage } from "element-plus";
import { GetXzq } from "@/api/homeApi.js";
export default {
  components: {
    ShjlDialog,
    GhcgDialog,
    CzghcgDialog,
    XxghcgDialog,
  },
  setup(props, context) {
    const { proxy } = getCurrentInstance();
    const parent = { ...context };
    const qxyh = reactive({
      formInline: {
        planType: "1",
        current: 1,
        size: 20,
        total: 0,
        divisionCode: "",
        subject: "",
      },
      xbid: "",
      fileList: [],
      xbfile: null,
      dialogVisible: false,
      xzqCode: [],
      xzoptions: [],
      instid: "",
      instids: "",
      cascader: ref(null),
      multipleTable: ref(null),
      ckxqDialog: false,
      ztghDialog: false,
      ghcgscDialog: false,
      xxghcgscDialog: false,
      ghcgbjDialog: false,
      editDialogVisible: false, //公共弹窗
      activeCg: {},
      activeCgb: {},
      options: [],
      shjllist: [],
      shjlShow: false,
      tableData: [],
      dialogTitle: "",
      dialogMessage1: "",
      dialogMessage2: "",
      editStatus: "",
      name: "",
      index: "",
      uuidList: [],
      uuidList1: "",
      getShzt(shzt) {
        switch (shzt) {
          case "0":
            return "待上报";
          case "1":
            return "已上报";
          case "2":
            return "退回";
          default:
            return "未知";
        }
      },
      handleSizeChange(val) {
        qxyh.formInline.size = val;
        qxyh.getlist2();
      },
      handleCurrentChange(val) {
        qxyh.formInline.current = val;
        qxyh.getlist2();
      },
      // 筛选
      changeForm() {
        qxyh.formInline.current = 1;
        qxyh.getlist();
      },
      // 查询
      onSearch() {
        qxyh.getlist();
      },
      // 详情
      detail(activeCg) {
        qxyh.activeCg = activeCg;
        qxyh.ckxqDialog = true;
      },
      handleClose() {
        qxyh.dialogVisible = false;
        qxyh.xbfile = null;
        qxyh.fileList = [];
      },
      // 审核记录
      open(row) {
        let id = row.id;
        let instId = row.instid;
        getLandTaskStatus({
          id: id,
          instId: instId,
        }).then((res) => {
          if (res && res.data && res.data.length > 0) {
            qxyh.shjllist = res.data;
            qxyh.shjlShow = true;
          } else {
            ElMessage.error("审核记录列表为空");
          }
        });
      },
      // 修编记录
      xbUpload(row) {
        qxyh.instid = row.instid;
        qxyh.xbid = row.id;
        qxyh.dialogVisible = true;
      },
      // 修编记录
      xbDownload(id) {
        window.open(
          request.defaults.baseURL + "/apply/cggl/xbfiledownload?id=" + id,
        );
      },
      handleRemove() {
        qxyh.xbfile = null;
        qxyh.fileList = [];
      },
      handleChangeFile(file, fileList) {
        qxyh.xbfile = file.raw;
        qxyh.fileList = fileList;
      },
      xbSubmit() {
        if (!qxyh.instid) {
          ElMessage.error("请输入流程主键");
        } else {
          console.log("开始修编上传");
          const formdata = new FormData();
          formdata.append("instid", qxyh.instid);
          formdata.append("id", qxyh.xbid);
          reuploadThirdpartyReviseData(formdata).then((res) => {
            if (res.success) {
              ElMessage.success("修编上报成功");
              qxyh.dialogVisible = false;
              qxyh.xbfile = null;
              qxyh.fileList = [];
            } else {
              ElMessage.error("修编上报失败");
            }
            qxyh.getlist();
          });
        }
      },
      setXzqdm() {
        if (qxyh.xzqCode && qxyh.xzqCode.length > 0) {
          qxyh.formInline.divisionCode = qxyh.xzqCode[qxyh.xzqCode.length - 1];
        } else {
          qxyh.formInline.divisionCode = "";
        }
        console.log(qxyh.formInline.divisionCode);
      },
      upload(row) {
        qxyh.instid = row.instid;
        if (qxyh.formInline.planType == "1") {
          qxyh.ztghDialog = true;
        } else if (qxyh.formInline.planType == "2") {
          qxyh.ghcgscDialog = true;
        } else if (qxyh.formInline.planType == "3") {
          qxyh.ztghDialog = true;
        }
      },
      // 获取行政区
      getXzq() {
        GetXzq({ city: true }).then((res) => {
          if (res.success) {
            qxyh.xzoptions = proxy.$comfun.resetTree(res.data);
            qxyh.getlist();
          }
        });
      },
      // 审查报告
      download(row) {
        let id = row.id;
        let solId = row.solId;
        reportDownloadAction({
          id: id,
          solId: solId,
        }).then((res) => {
          if (res.type == "application/json") {
            ElMessage.info("质检审查报告暂没生成。");
          } else {
            let blob = new Blob([res], { type: "application/zip" });
            qxyh.ways(blob, ".zip");
          }
        });
      },
      //创建文件超链接并进行下载
      ways(blob, suffix, res) {
        let elink = document.createElement("a");
        elink.style.display = "none"; // 隐藏标签
        elink.href = window.URL.createObjectURL(blob); // 配置href
        // 获取后端返回的响应头中的名称
        // let filename = res.headers["content-disposition"];
        // let newFilename = filename.split(";")[1].split("=")[1];
        let newFilename = "report" + suffix;
        newFilename = decodeURIComponent(newFilename);
        elink.download = newFilename;
        elink.click();
        URL.revokeObjectURL(elink.href); // 释放URL 对象(弹出框进行下载)
        document.body.removeChild(elink); // 移除<a>标签
      },
      // 获取列表数据
      getlist2() {
        getxblist(qxyh.formInline).then((res) => {
          qxyh.tableData = res.data;
          qxyh.formInline.total = res.recordstotal || 999;
        });
      },
      // 获取列表数据
      getlist() {
        getxblist(qxyh.formInline).then((res) => {
          qxyh.formInline.current = 1;
          qxyh.tableData = res.data;
          qxyh.formInline.total = res.recordstotal || 999;
        });
      },
    });
    onMounted(() => {
      //   qxyh.getlist();
      //   qxyh.getXzq();
      qxyh.getXzq();
    });
    return { ...toRefs(qxyh) };
  },
};
</script>

<style lang="less" scoped>
.qxyh {
  .header {
    border-bottom: 1px solid rgb(230, 230, 230);
    justify-content: space-between;
    flex-wrap: nowrap;
    height: 60px;
  }
  .header-left {
    margin-left: 20px;
  }
  :deep(.el-form-item) {
    margin-bottom: 0;
  }
  .footer {
    width: 100%;
    padding: 10px;
  }
}
</style>
<style lang="less">
.popper-cascader {
  .el-cascader-menu {
    max-height: 400px;
    overflow: auto;
    height: inherit;
  }
}
.search-btn {
  position: absolute;
  right: -40px;
}
.dialog-footer {
  width: 100%;
  text-align: center;
  // position: absolute;
  bottom: 30px;
}
</style>