zhengyiming
11 小时以前 97f29024ce18babeb4b635c5d73f907ac493976e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
/*
 * @Author: 秦少卫
 * @Date: 2024-06-09 13:02:18
 * @LastEditors: 秦少卫
 * @LastEditTime: 2024-06-10 20:21:41
 * @Description: 管理面板管理
 */
 
import { updataTempl, uploadImg, deleteImg, getTempl, createdTempl } from '@/api/admin';
import { Spin } from 'view-ui-plus';
 
import { useRouter } from 'vue-router';
 
export default function useMaterial() {
  const canvasEditor = inject('canvasEditor');
  const router = useRouter();
  // 画布转图片
  const uploadFileToInfo = async () => {
    const dataURLtoFile = (dataurl, filename) => {
      var arr = dataurl.split(','),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n);
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
      }
      return new File([u8arr], filename, { type: mime });
    };
 
    const upload = (base64) => {
      const file = dataURLtoFile(base64, '123.png');
      const formData = new FormData();
      const time = new Date();
      formData.append('files', file, `${time.getTime()}`);
      return uploadImg(formData)
        .then((res) => {
          const [info] = res.data;
          return info;
        })
        .catch((err) => {
          console.log(err);
        });
    };
    const base64 = await canvasEditor.preview();
    // 上传图片
    const fileInfo = await upload(base64);
    return fileInfo.id;
  };
 
  // 更新详情
  const updataTemplHander = async (id) => {
    Spin.show();
    try {
      const { data: info } = await getTempl(id);
      const newImgId = await uploadFileToInfo();
      const json = canvasEditor.getJson();
      await updataTempl(info.id, {
        ...info,
        img: newImgId,
        json,
      });
      deleteImg(info.img.id);
    } catch (error) {
      console.log(error);
    }
 
    Spin.hide();
  };
 
  const createdTemplHander = async (name) => {
    Spin.show();
    try {
      const newImgId = await uploadFileToInfo();
      const json = canvasEditor.getJson();
      const res = await createdTempl({
        name,
        img: newImgId,
        json,
      });
      router.replace('/?tempId=' + res.data.id + '&admin=true');
    } catch (error) {
      console.log(error);
    }
 
    Spin.hide();
  };
  return {
    updataTemplHander,
    createdTemplHander,
  };
}