海川开心-附件修改

周宾

6 天以前 1a07a66b03163dc5344595c67c00fba4f0573904

海川开心-附件修改

 src/views/salesManagement/invoiceLedger/fileList.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,67 @@
<template>
  <el-dialog v-model="dialogVisible" title="附件" width="40%" :before-close="handleClose">
    <el-table :data="tableData" border height="40vh">
      <el-table-column label="附件名称" prop="name" min-width="400" show-overflow-tooltip />
      <el-table-column fixed="right" label="操作" width="150" align="center">
        <template #default="scope">
          <el-button link type="primary" size="small" @click="downLoadFile(scope.row)">下载</el-button>
          <el-button link type="primary" size="small" @click="lookFile(scope.row)">预览</el-button>
          <el-button link type="danger" size="small" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
  <filePreview ref="filePreviewRef" />
</template>

<script setup>
import { ref } from 'vue'
import { ElMessageBox, ElMessage } from 'element-plus'
import filePreview from '@/components/filePreview/index.vue'
import { delCommonFile } from '@/api/publicApi/commonFile.js'

const dialogVisible = ref(false)
const tableData = ref([])
const { proxy } = getCurrentInstance();
const filePreviewRef = ref()
const handleClose = () => {
  dialogVisible.value = false
}
const open = (list) => {
  dialogVisible.value = true
  tableData.value = list
}
const downLoadFile = (row) => {
  proxy.$download.name(row.url);

}
const lookFile = (row) => {
  filePreviewRef.value.open(row.url)
}
// åˆ é™¤é™„件
const handleDelete = (row) => {
  ElMessageBox.confirm(`确认删除附件"${row.name}"吗？`, '删除确认', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning',
  }).then(() => {
    delCommonFile([row.id]).then(() => {
      ElMessage.success('删除成功')
      // ä»Žåˆ—表中移除已删除的附件
      const index = tableData.value.findIndex(item => item.id === row.id)
      if (index !== -1) {
        tableData.value.splice(index, 1)
      }
    }).catch(() => {
      ElMessage.error('删除失败')
    })
  }).catch(() => {
    proxy.$modal.msg('已取消删除')
  })
}
defineExpose({
  open
})
</script>

<style></style>

 src/views/salesManagement/invoiceLedger/index.vue

@@ -42,7 +42,7 @@
        <el-table-column label="录入人" prop="invoicePerson" show-overflow-tooltip />
        <el-table-column label="录入日期" prop="createTime" show-overflow-tooltip :formatter="formatDate" width="180" />
        <el-table-column label="开票日期" prop="invoiceDate" show-overflow-tooltip width="120" />
        <el-table-column label="发票" prop="invoiceFileName" width="120" align="center" show-overflow-tooltip fixed="right">
        <!-- <el-table-column label="发票" prop="invoiceFileName" width="120" align="center" show-overflow-tooltip fixed="right">
          <template #default="scope">
            <el-button v-if="scope.row.invoiceFileName" text bg type="primary"
              @click="handleFile(scope.row.commonFiles)">
@@ -52,10 +52,11 @@
              ä¸Šä¼ 
            </el-button>
          </template>
        </el-table-column>
        </el-table-column> -->
        <el-table-column fixed="right" label="操作" width="150" align="center">
          <template #default="scope">
            <el-button link type="primary" size="small" @click="openForm(scope.row)">编辑</el-button>
            <el-button link type="primary" size="small" @click="downLoadFile(scope.row)">附件</el-button>
            <el-button link type="primary" size="small" @click="delInvoiceLedger(scope.row)">删除</el-button>
          </template>
        </el-table-column>
@@ -148,6 +149,7 @@
        </div>
      </template>
    </el-dialog>
    <FileList ref="fileListRef" />
  </div>
</template>

@@ -164,9 +166,11 @@
  registrationProductPage,
  delInvoiceLedgerByRegProductId,
} from "../../../api/salesManagement/invoiceLedger.js";
import { getSalesLedgerWithProducts } from "@/api/salesManagement/salesLedger.js";
import useUserStore from "@/store/modules/user.js";
import useFormData from "@/hooks/useFormData";
import dayjs from "dayjs";
import FileList from "./fileList.vue";

const { proxy } = getCurrentInstance();
const tableData = ref([]);
@@ -292,7 +296,6 @@
};
// ä¸Šä¼ å‰æ ¡æ£€
function handleBeforeUpload(file) {
  console.log("file", file);
  // æ ¡æ£€æ–‡ä»¶å¤§å°
  if (file.size > 1024 * 1024 * 10) {
    proxy.$modal.msgError("上传文件大小不能超过10MB!");
@@ -304,6 +307,7 @@
    proxy.$modal.msgError("文件格式不匹配");
    return false;
  }
  console.log('handleBeforeUpload');
  proxy.$modal.loading("正在上传文件，请稍候...");
  return true;
}
@@ -315,9 +319,10 @@
// ä¸Šä¼ æˆåŠŸå›žè°ƒ
function handleUploadSuccess(res, file, uploadFiles) {
  proxy.$modal.closeLoading();
  console.log('handleUploadSuccess');
  if (res.code === 200) {
    proxy.$refs["fileUpload"].handleRemove(file);
    fileList.value.push(res.data);
    // proxy.$refs["fileUpload"].handleRemove(file);
    // fileList.value.push(res.data);
    proxy.$modal.msgSuccess("上传成功");
  } else {
    proxy.$modal.msgError(res.msg);
@@ -326,10 +331,10 @@
}
// ç§»é™¤æ–‡ä»¶
function handleRemove(file) {
  let index = fileList.value.findIndex((item) => item.url === file.url);
  if (index > -1) {
    fileList.value.splice(index, 1);
  }
  // let index = fileList.value.findIndex((item) => item.url === file.url);
  // if (index > -1) {
  //   fileList.value.splice(index, 1);
  // }
}
// æäº¤è¡¨å•
const submitForm = () => {
@@ -434,6 +439,15 @@
  getList();
};

//附件相关
const fileListRef = ref(null)
//查看附件
const downLoadFile = (row) => {
  getSalesLedgerWithProducts({ id: row.id, type: 1 }).then((res) => {
    fileListRef.value.open(res.salesLedgerFiles)
  });
}

onMounted(() => {
  // è®¾ç½®å¼€ç¥¨æ—¥æœŸèŒƒå›´é»˜è®¤å€¼ä¸ºå½“天
  const today = dayjs().format('YYYY-MM-DD');