杂乱的

99 阅读1分钟

这个需求是点击这个培训人数页面的时候 会返回一个接口 如果这个接口有数据 就走put这接口 如果没有数据 走post

image.png

image.png

后台返回时间戳转换

image.png

时间选择器 开始日期和结束日期 跨月的时候 容易操作月份日子不对

*24(一天24小时)*60(一小时60分钟)*60(一分钟60秒)*1000(一秒1000毫秒) image.png

时间选择器 使用这个组件之后记得把这个绑定在queryparams的字段传到接口里面 然后和后端联调 然后后端进行匹配

image.png

image.png

可以直接在表单里面校验 image.png

image.png

这个内容是我显示的内容 一行一行显示 需要转一下 image.png

上传

image.png

image.png

image.png

文件预览 image.png

image.png

下载

image.png

image.png

image.png

之前数据需要转换的 image.png

之前下载封装的方式和我这个不同 同样都是后端返回的是二进流 但是这个后端数据处理好了 是word文件

image.png

    function handleExport() {
      let params = {
        areaId: props.data.areaId,
        projectId: props.data.projectId,
        customerId: props.data.customerId,
      };
      axios({
        method: "post",
        url: baseURL + "下载路径",
        data: params,
        responseType: "blob", //防止导出文件破损或乱码
        headers: { "Content-Type": "application/json,charset=utf-8" },
      })
        .then((res) => {
          console.log("res", res);
          if (res.status == 200) {
            const link = document.createElement("a");
            let blob = new Blob([res.data], { type: "application/vnd.ms-excel" });
            link.style.display = "none";
            link.href = URL.createObjectURL(blob); //创建url对象
            link.download = res.headers["download-filename"]; //下载后文件名
            console.log(res.headers["download-filename"]);
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            URL.revokeObjectURL(link.href); //销毁url对象
          }
        })
        .catch((err) => {
          console.log(err, "err");
        });