feat

pyt

2025-03-20 bd30f37040c59a04c74084371f1477968ff4bfc4

feat

 src/views/storing-data/components/UploadDialog.vue

@@ -1,23 +1,32 @@
<template>
  <el-dialog
    :title="type === 'add' ? '新增资料' : '编辑资料'"
    :title="type === 'add' ? '新增资料' : type === 'edit' ? '编辑资料' : '资料详情'"
    :visible.sync="dialogVisible"
    width="40%"
    @close="handleClose"
  >
    <el-form ref="uploadForm" :model="form" :rules="rules" label-width="120px">
      <el-form-item label="镇(街道)" prop="batchNo">
        <el-input v-model="form.batchNo" placeholder="请输入" />
      <el-form-item label="镇(街道)" prop="street">
        <el-select :disabled="type === 'detail'" v-model="form.street" placeholder="请选择" @change="handleStreetChange">
          <el-option v-for="item in streetOptions" :key="item.dictCode" :label="item.dictLabel" :value="item.dictLabel"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="资料名称" prop="batchNo">
        <el-input v-model="form.batchNo" placeholder="请输入" />
      <el-form-item label="资料名称" prop="name">
        <el-input v-model="form.name" :disabled="type === 'detail'" placeholder="请输入" />
      </el-form-item>
      <el-form-item label="资料文件" prop="file">
        <el-upload
          :disabled="type === 'detail'"
          ref="upload"
          class="upload-demo"
          drag
          action="#"
          :auto-upload="false"
          action="http://182.140.209.168:8888/api/common/upload"
          :headers="{
            'Authorization': 'Bearer ' + token
          }"
          :file-list="fileList"
          :on-success="handleUploadSuccess"
          :on-error="handleUploadError"
          :on-change="handleFileChange"
          :limit="1"
        >
@@ -30,13 +39,16 @@
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitUpload">确 定</el-button>
      <el-button v-if="type !== 'detail'" type="primary" @click="submitUpload">确 定</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { getToken } from '@/utils/auth'
import { add, update } from "@/api/storing-data";

export default {
  name: 'UploadDialog',
  props: {
@@ -47,21 +59,30 @@
    type: {
      type: String,
      default: 'add',
      validator: function(value) {
        return ['add', 'batch'].indexOf(value) !== -1
      }
    },
    streetOptions: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      token: getToken(),
      dialogVisible: false,
      fileList: [],
      form: {
        batchNo: '',
        file: null
        street: '',
        name: '',
        file: null,
        attachName: '',
        attachUrl: ''
      },
      rules: {
        batchNo: [
          { required: true, message: '请输入批次号', trigger: 'blur' }
        street: [
          { required: true, message: '请选择镇(街道)', trigger: 'change' }
        ],
        name: [
          { required: true, message: '请输入资料名称', trigger: 'blur' }
        ],
        file: [
          { required: true, message: '请选择上传文件', trigger: 'change' }
@@ -79,35 +100,68 @@
  },
  methods: {
    handleClose() {
      this.form.batchNo = '';
      this.form.file = null;
      this.form = {
        street: '',
        name: '',
        file: null,
        attachName: '',
        attachUrl: ''
      };
      this.$refs.uploadForm && this.$refs.uploadForm.resetFields();
      // 清空文件列表
      this.$refs.upload && this.$refs.upload.clearFiles();
    },
    handleFileChange(file) {
      this.form.file = file.raw;
      this.form.attachName = file.name;
      // 手动触发文件字段验证
      this.$refs.uploadForm.validateField('file');
    },
    // 处理上传成功
    handleUploadSuccess(response, file) {
      if (response.code === 200) {
        this.form.attachUrl = response.url;
        this.$message.success('文件上传成功');
      } else {
        this.$message.error(response.msg || '文件上传失败');
      }
    },
    // 处理上传失败
    handleUploadError(err) {
      this.$message.error('文件上传失败');
    },
    submitUpload() {
      this.$refs.uploadForm.validate(valid => {
        if (!valid) {
          return;
        }
        
        // 这里添加实际的上传逻辑
        const formData = new FormData();
        formData.append('file', this.form.file);
        if (this.type === 'add') {
          formData.append('batchNo', this.form.batchNo);
        if (!this.form.attachUrl) {
          this.$message.error('请先上传文件');
          return;
        }
        // 构建提交数据
        const submitData = {
          street: this.form.street,
          name: this.form.name,
          attachName: this.form.attachName,
          attachUrl: this.form.attachUrl
        };

        // 模拟上传
        this.$message.info('正在上传，请稍候...');
        setTimeout(() => {
          this.$emit('success');
          this.handleClose();
        }, 1000);
        if (this.type === 'add') {
          add(submitData).then(res => {
            this.$emit('success', res.data);
            this.handleClose();
          });
        } else {
          update(submitData).then(res => {
            this.$emit('success', res.data);
            this.handleClose();
          });
        }
      });
    },
    handleStreetChange(value) {
      // 处理镇(街道)选择变化后的逻辑
    }
  }
}

 src/views/storing-data/index.vue

@@ -4,20 +4,10 @@
    <div class="search-area">
      <el-form :inline="true" :model="queryParams" class="search-form">
        <el-form-item label="镇街">
          <el-input
            v-model="queryParams.street"
            placeholder="请输入"
            clearable
            size="small"
          />
          <el-input v-model="queryParams.street" placeholder="请输入" clearable size="small" />
        </el-form-item>
        <el-form-item label="资料名称">
          <el-input
            v-model="queryParams.name"
            placeholder="请输入"
            clearable
            size="small"
          />
          <el-input v-model="queryParams.name" placeholder="请输入" clearable size="small" />
        </el-form-item>
        <el-form-item>
          <el-button type="default" @click="resetQuery">重置</el-button>
@@ -32,43 +22,24 @@
    </div>

    <!-- 表格区域 -->
    <el-table
      v-loading="loading"
      :data="tableData"
      border
      style="width: 100%"
    >
      <el-table-column prop="batchNo" label="镇/街道" min-width="120" align="center" />
      <el-table-column prop="totalApplications" label="资料名称" min-width="100" align="center" >
    <el-table v-loading="loading" :data="tableData" border style="width: 100%">
      <el-table-column prop="street" label="镇/街道" min-width="120" align="center" />
      <el-table-column prop="name" label="资料名称" min-width="100" align="center">
        
      </el-table-column>
      <el-table-column prop="totalApplicants" label="附件内容" min-width="100" align="center" >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            @click="handleView(scope.row, 'view')"
          >查看</el-button>
          <el-button type="text" @click="handleDownload(scope.row)">{{ scope.row.attachName }}</el-button>
        </template>
      </el-table-column>
      <el-table-column prop="totalApplicants" label="附件内容" min-width="100" align="center" />
      <el-table-column prop="compensationAmount" label="更新时间" min-width="150" align="center" />
      
      <el-table-column prop="updateTime" label="更新时间" min-width="150" align="center" />

      <el-table-column label="操作" width="180" align="center" fixed="right">
        <template slot-scope="scope">
          <template>
            <el-button
              size="mini"
              type="text"
              @click="handleView(scope.row, 'detail')"
            >详情</el-button>
            <el-button
              size="mini"
              type="text"
              @click="handleView(scope.row, 'detail')"
            >编辑</el-button>
            <el-button
              size="mini"
              type="text"
              @click="handleDelete(scope.row)"
            >删除</el-button>
            <el-button size="mini" type="text" @click="handleView(scope.row, 'detail')">详情</el-button>
            <el-button size="mini" type="text" @click="handleView(scope.row, 'edit')">编辑</el-button>
            <el-button size="mini" type="text" @click="handleDelete(scope.row)">删除</el-button>
          </template>
        </template>
      </el-table-column>
@@ -76,35 +47,19 @@

    <!-- 分页区域 -->
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryParams.pageNum"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="queryParams.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
        :current-page="queryParams.pageNum" :page-sizes="[10, 20, 30, 40]" :page-size="queryParams.pageSize"
        layout="total, sizes, prev, pager, next, jumper" :total="total">
      </el-pagination>
    </div>

    <!-- 审核对话框 -->
    <approval-dialog
      ref="approvalDialog"
      :visible.sync="approvalDialogVisible"
      :type="approvalType"
      :row-data="currentRow"
      @audit-submit="handleApprovalSubmit"
    />
    <approval-dialog ref="approvalDialog" :visible.sync="approvalDialogVisible" :type="approvalType"
      :row-data="currentRow" @audit-submit="handleApprovalSubmit" />

    <!-- 上传组件 -->
    <upload-dialog
      ref="uploadDialog"
      :visible.sync="uploadDialogVisible"
      :type="uploadType"
      @success="handleUploadSuccess"
    />
    <upload-dialog ref="uploadDialog" :visible.sync="uploadDialogVisible" :type="uploadType" :streetOptions="streetOptions"
      @success="handleUploadSuccess" />
  </div>
</template>

@@ -113,7 +68,7 @@
import UploadDialog from "./components/UploadDialog";
import ApprovalDialog from "./components/ApprovalDialog";
import { list, add, del, update } from "@/api/storing-data";

import { getDictData } from '@/api/placement'

export default {
  name: "StoringData",
@@ -150,10 +105,15 @@
        street: undefined,
        name: undefined
      },
      streetOptions: []
    };
  },
  created() {
    this.getList();
    // 镇（街道）
    getDictData('street').then(response => {
      this.streetOptions = response.data
    })
  },
  methods: {
    /** 查询列表 */
@@ -190,6 +150,14 @@
    handleImport() {
      // 实现下载逻辑
    },
    handleSizeChange(size) {
      this.queryParams.pageSize = size;
      this.getList();
    },
    handleCurrentChange(page) {
      this.queryParams.pageNum = page;
      this.getList();
    },
    /** 批量导入按钮操作 */
    handleBatchImport() {
      this.uploadType = "batch";
@@ -197,13 +165,10 @@
    },
    /** 统一的查看/详情按钮操作 */
    handleView(row, type) {
      this.$router.push({
        path: "/applicationBatchList/detail",
        query: {
          batchNo: row.batchNo,
          type: type // 'audit'/'view'/'detail'
        },
      });
      this.$refs.uploadDialog.form = JSON.parse(JSON.stringify(row));
      this.$refs.uploadDialog.fileList = [{name: row.attachName, url: row.attachUrl}];
      this.uploadType = type;
      this.uploadDialogVisible = true;
    },
    /** 审核提交处理 */
    handleApprovalSubmit(data) {
@@ -218,20 +183,22 @@
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      this.$confirm("是否确认删除该批次数据?", "警告", {
      this.$confirm("是否确认删除该资料?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          // 这里添加删除逻辑
          this.$message({
            type: "success",
            message: "删除成功！",
          });
          this.getList();
        })
        .catch(() => {});
          del({id: row.id}).then(res => {
            this.$message({
              type: "success",
              message: "删除成功！",
            });
            this.getList();
          })
          .catch(() => { });
      })
      .catch(() => { });
    },
    /** 上传成功回调 */
    handleUploadSuccess() {
@@ -240,6 +207,40 @@
      this.$message({
        type: "success",
        message: this.uploadType === "add" ? "新增成功！" : "批量导入成功！",
      });
    },
    // 处理文件下载
    handleDownload(row) {
      if (!row.attachUrl) {
        this.$message.error('文件不存在');
        return;
      }
      
      // 显示加载提示
      this.loading = true;
      
      // 使用fetch获取文件内容
      fetch(row.attachUrl)
      .then(response => response.blob())
      .then(blob => {
        // 创建blob URL
        const url = window.URL.createObjectURL(blob);
        // 创建临时a标签
        const link = document.createElement('a');
        link.href = url;
        link.download = row.attachName || '下载文件';
        document.body.appendChild(link);
        link.click();
        // 清理
        document.body.removeChild(link);
        window.URL.revokeObjectURL(url);
      })
      .catch(error => {
        console.error('下载失败:', error);
        this.$message.error('文件下载失败');
      })
      .finally(() => {
        this.loading = false;
      });
    },
  },
@@ -260,7 +261,7 @@
    .search-form {
      display: flex;
      align-items: center;
      

      .el-form-item {
        margin-bottom: 0;
        margin-right: 20px;
@@ -270,7 +271,7 @@

  .action-buttons {
    margin-bottom: 20px;
    

    .el-button {
      margin-right: 10px;
    }
@@ -278,10 +279,10 @@

  .el-table {
    margin-bottom: 20px;
    

    .el-button--text {
      padding: 0 8px;
      

      &:not(:last-child) {
        border-right: 1px solid #dcdfe6;
      }