first commit

src/tool/colorthief/colorthief.js

@@ -0,0 +1,147 @@
+import quantize from 'quantize';
+import core from './core.js';
+
+/*
+ * Color Thief v2.3.2
+ * by Lokesh Dhakar - http://www.lokeshdhakar.com
+ *
+ * Thanks
+ * ------
+ * Nick Rabinowitz - For creating quantize.js.
+ * John Schulz - For clean up and optimization. @JFSIII
+ * Nathan Spady - For adding drag and drop support to the demo page.
+ *
+ * License
+ * -------
+ * Copyright Lokesh Dhakar
+ * Released under the MIT license
+ * https://raw.githubusercontent.com/lokesh/color-thief/master/LICENSE
+ *
+ * @license
+ */
+
+
+/*
+  CanvasImage Class
+  Class that wraps the html image element and canvas.
+  It also simplifies some of the canvas context manipulation
+  with a set of helper functions.
+*/
+
+const CanvasImage = function (image) {
+    this.canvas  = document.createElement('canvas');
+    this.context = this.canvas.getContext('2d');
+    this.width  = this.canvas.width  = image.naturalWidth;
+    this.height = this.canvas.height = image.naturalHeight;
+    this.context.drawImage(image, 0, 0, this.width, this.height);
+};
+
+CanvasImage.prototype.getImageData = function () {
+    return this.context.getImageData(0, 0, this.width, this.height);
+};
+
+var ColorThief = function () {};
+
+/*
+ * getColor(sourceImage[, quality])
+ * returns {r: num, g: num, b: num}
+ *
+ * Use the median cut algorithm provided by quantize.js to cluster similar
+ * colors and return the base color from the largest cluster.
+ *
+ * Quality is an optional argument. It needs to be an integer. 1 is the highest quality settings.
+ * 10 is the default. There is a trade-off between quality and speed. The bigger the number, the
+ * faster a color will be returned but the greater the likelihood that it will not be the visually
+ * most dominant color.
+ *
+ * */
+ColorThief.prototype.getColor = function(sourceImage, quality = 10) {
+    const palette       = this.getPalette(sourceImage, 5, quality);
+    const dominantColor = palette[0];
+    return dominantColor;
+};
+
+
+/*
+ * getPalette(sourceImage[, colorCount, quality])
+ * returns array[ {r: num, g: num, b: num}, {r: num, g: num, b: num}, ...]
+ *
+ * Use the median cut algorithm provided by quantize.js to cluster similar colors.
+ *
+ * colorCount determines the size of the palette; the number of colors returned. If not set, it
+ * defaults to 10.
+ *
+ * quality is an optional argument. It needs to be an integer. 1 is the highest quality settings.
+ * 10 is the default. There is a trade-off between quality and speed. The bigger the number, the
+ * faster the palette generation but the greater the likelihood that colors will be missed.
+ *
+ *
+ */
+ColorThief.prototype.getPalette = function(sourceImage, colorCount, quality) {
+    const options = core.validateOptions({
+        colorCount,
+        quality
+    });
+
+    // Create custom CanvasImage object
+    const image      = new CanvasImage(sourceImage);
+    const imageData  = image.getImageData();
+    const pixelCount = image.width * image.height;
+
+    const pixelArray = core.createPixelArray(imageData.data, pixelCount, options.quality);
+
+    // Send array to quantize function which clusters values
+    // using median cut algorithm
+    const cmap    = quantize(pixelArray, options.colorCount);
+    const palette = cmap? cmap.palette() : null;
+
+    return palette;
+};
+
+ColorThief.prototype.getColorFromUrl = function(imageUrl, callback, quality) {
+    const sourceImage = document.createElement("img");
+
+    sourceImage.addEventListener('load' , () => {
+        const palette = this.getPalette(sourceImage, 5, quality);
+        const dominantColor = palette[0];
+        callback(dominantColor, imageUrl);
+    });
+    sourceImage.src = imageUrl
+};
+
+
+ColorThief.prototype.getImageData = function(imageUrl, callback) {
+    let xhr = new XMLHttpRequest();
+    xhr.open('GET', imageUrl, true);
+    xhr.responseType = 'arraybuffer';
+    xhr.onload = function() {
+        if (this.status == 200) {
+            let uInt8Array = new Uint8Array(this.response);
+            i = uInt8Array.length;
+            let binaryString = new Array(i);
+            for (let i = 0; i < uInt8Array.length; i++){
+                binaryString[i] = String.fromCharCode(uInt8Array[i]);
+            }
+            let data = binaryString.join('');
+            let base64 = window.btoa(data);
+            callback ('data:image/png;base64,' + base64);
+        }
+    }
+    xhr.send();
+};
+
+ColorThief.prototype.getColorAsync = function(imageUrl, callback, quality) {
+    const thief = this;
+    this.getImageData(imageUrl, function(imageData){
+        const sourceImage = document.createElement("img");
+        sourceImage.addEventListener('load' , function(){
+            const palette = thief.getPalette(sourceImage, 5, quality);
+            const dominantColor = palette[0];
+            callback(dominantColor, this);
+        });
+        sourceImage.src = imageData;
+    });
+};
+
+
+export default ColorThief;

src/tool/colorthief/core.js

@@ -0,0 +1,47 @@
+function createPixelArray(imgData, pixelCount, quality) {
+    const pixels = imgData;
+    const pixelArray = [];
+
+    for (let i = 0, offset, r, g, b, a; i < pixelCount; i = i + quality) {
+        offset = i * 4;
+        r = pixels[offset + 0];
+        g = pixels[offset + 1];
+        b = pixels[offset + 2];
+        a = pixels[offset + 3];
+
+        // If pixel is mostly opaque and not white
+        if (typeof a === 'undefined' || a >= 125) {
+            if (!(r > 250 && g > 250 && b > 250)) {
+                pixelArray.push([r, g, b]);
+            }
+        }
+    }
+    return pixelArray;
+}
+
+function validateOptions(options) {
+    let { colorCount, quality } = options;
+
+    if (typeof colorCount === 'undefined' || !Number.isInteger(colorCount)) {
+        colorCount = 10;
+    } else if (colorCount === 1 ) {
+        throw new Error('colorCount should be between 2 and 20. To get one color, call getColor() instead of getPalette()');
+    } else {
+        colorCount = Math.max(colorCount, 2);
+        colorCount = Math.min(colorCount, 20);
+    }
+
+    if (typeof quality === 'undefined' || !Number.isInteger(quality) || quality < 1) {
+        quality = 10;
+    }
+
+    return {
+        colorCount,
+        quality
+    }
+}
+
+export default {
+    createPixelArray,
+    validateOptions
+};

src/tool/cookie.js

@@ -0,0 +1,30 @@
+const setCookie = (name,value) => {
+    var Days = 30;
+    var exp = new Date();
+    exp.setTime(exp.getTime() + Days*24*60*60*30);
+    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
+}
+
+const getCookie = (name) => {
+    var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
+    if(arr=document.cookie.match(reg))
+    return unescape(arr[2]);
+    else
+    return null;
+}
+
+function WriteCookie(name) {
+    var now = new Date();
+    now.setMonth( now.getMonth() - 1 );
+    cookievalue = escape(document.myform.customer.value) + ";"
+    
+    document.cookie = name + '=' + cookievalue;
+    document.cookie = "expires=" + now.toUTCString() + ";"
+    document.write("Setting Cookies : " + "name=" + cookievalue );
+  }
+
+export {
+    setCookie,
+    getCookie,
+    WriteCookie
+}

src/tool/flexible.js

@@ -0,0 +1,43 @@
+let flexible = (designWidth, maxWidth) =>{
+    var doc = document, win = window, docEl = doc.documentElement, remStyle = document.createElement("style"), tid;
+    designWidth = designWidth || 1440;
+    maxWidth = maxWidth || 1440;
+    function refreshRem() {
+        var width = docEl.getBoundingClientRect().width;
+        maxWidth = maxWidth || 1440;
+        width > maxWidth && (width = maxWidth);
+        var rem = width * 10 / designWidth;
+        remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
+    }
+    if (docEl.firstElementChild) {
+        docEl.firstElementChild.appendChild(remStyle);
+    } else {
+        var wrap = doc.createElement("div");
+        wrap.appendChild(remStyle);
+        doc.write(wrap.innerHTML);
+        wrap = null;
+    }
+    //要等 wiewport 设置好后才能执行 refreshRem，不然 refreshRem 会执行2次；
+    refreshRem();
+    win.addEventListener("resize", function() {
+        clearTimeout(tid); //防止执行两次
+        tid = setTimeout(refreshRem, 300);
+    }, false);
+
+    win.addEventListener("pageshow", function(e) {
+        if (e.persisted) { // 浏览器后退的时候重新计算
+            clearTimeout(tid);
+            tid = setTimeout(refreshRem, 300);
+        }
+    }, false);
+
+    if (doc.readyState === "complete") {
+        doc.body.style.fontSize = "16px";
+    } else {
+        doc.addEventListener("DOMContentLoaded", function(e) {
+            doc.body.style.fontSize = "16px";
+        }, false);
+    }
+};
+
+export default flexible

src/tool/https.js

@@ -0,0 +1,139 @@
+import axios from 'axios'
+// import qs from 'qs'
+// import message from '@/components/public/message/src'
+
+import router from '@/router/index'
+import {getCookie} from '@/tool/cookie'
+// import cookie from '@/tools/cookie.js'
+
+axios.defaults.timeout = 60000;                        //响应时间
+axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';        //配置请求头
+axios.defaults.withCredentials = true;  //跨域携带cookie
+import { message } from 'ant-design-vue';
+axios.defaults.baseURL = process.env.VUE_APP_BASE_URL;   //配置接口地址
+
+//POST传参序列化(添加请求拦截器)
+axios.interceptors.request.use((config) => {
+    //在发送请求之前做某件事
+    if(config.method  === 'post' || config.method  === 'put' || config.method  === 'delete'){
+        // config.data = qs.stringify(config.data);
+        // config.data = JSON.stringify(config.data);
+    }
+
+    config.headers.Authorization = getCookie('token'); 
+    return config;
+},(error) =>{
+    return Promise.reject(error);
+});
+
+//返回状态判断(添加响应拦截器)
+axios.interceptors.response.use((res) =>{
+    if (res.data) {
+        if (res.data.errCode === 0) {
+            return Promise.resolve(res.data.data);
+            
+        } else {
+            message.error(res.data.errMsg)
+            return Promise.reject(res.data);
+        }
+    } else {
+        message.error(res.data.errMsg)
+        return Promise.reject(res.data);
+    }
+    
+}, function(error) {
+    if(error?.response?.status === 401){
+        router.replace('/login')
+        return Promise.reject()
+    }
+    let data_new = error?.response?.data
+    message.error(data_new?.errMsg || 'Error: server exception')
+    return Promise.reject(data_new);
+    
+});
+
+export const Https = {
+    httpUrls: {
+        interfaceUrl: '',
+        accountIsLogin:'/api/account/isLogin', //判断用户是否登录
+        accountLogin:'/api/account/login', //账号密码登录接口
+        preLogin:'/api/account/preLogin',//预先登入
+        accountSendEmail:'/api/account/sendEmail', //发送邮件
+        accountResetPwd:'/api/account/resetPwd', //忘记密码修改
+        accountLogout:'/api/account/logout',//登出
+        accountBindEmail:'/api/account/bindEmail', //绑定邮箱
+        elementGeneratePrint:'/api/element/generatePrint', //生成印花
+        elementSavePrint:'/api/element/savePrint',//保存印花
+        getRgbByTcx:'/api/element/getRgbByTcx', // 通过hsv值获取潘通信息
+        getRgbByHsv:'/api/element/getRgbByHsv', //通过hsv值获取潘通信息
+        designCollection:'/api/design/designCollection', //设计 Conllection
+        reDesignCollection:'/api/design/reDesignCollection',//重新设计 Conllection
+        countDesignProcess:'/api/design/countDesignProcess', //统计design进度
+        getRgbByHsvBatch:'/api/element/getRgbByHsvBatch', //通过hsv值数组批量获取潘通信息
+        designLike:'/api/design/like', //Design Like
+        designDislike: '/api/design/dislike', //Design Dislike
+        queryUserGroup:'/api/history/queryUserGroup', //History用户分页分组列表
+        deleteUserGroup:'/api/history/deleteUserGroup', //History删除用户分组
+        updateUserGroupName:'/api/history/updateUserGroupName', //History修改用户分组名
+        historyChoose:'/api/history/choose', //History choose
+        getDesignDetail:'/api/design/detail/getDetail',//查询design详情
+        generateHighDesign:'/api/design/detail/generateHighDesign',//生成高级design图片
+        getNextSysElement:'/api/design/detail/getNextSysElement',//切换系统的element
+        detailPrintDot:'/api/design/detail/printDot',//print打点预览
+        designSingle:'/api/design/detail/designSingle',//单个design
+        queryLibraryPage:'/api/library/queryLibraryPage',//Library分页列表
+        libraryUpload:'/api/library/upload', // Library文件上传
+        batchUpdateLibraryName:'/api/library/batchUpdateLibraryName',//Library修改用户文件名
+        batchDeleteLibrary:'/api/library/batchDeleteLibrary',//删除library
+        queryLibraryTopAndBottomPage:'/api/library/queryLibraryTopAndBottomPage',//Library分页列表(查询top和bottom)
+        deleteHighDesign:'/api/design/detail/deleteHighDesign',//删除高级design图片
+        saveOrEditTemplatePoint:'/api/library/saveOrEditTemplatePoint',//保存或者编辑template打点
+        libraryModelsDot:'/api/library/modelsDot',//Models打点预览
+     
+    },
+
+    axiosGet(url,config) {
+        return new Promise((resolve, reject) => {
+            axios.get(url,config).then(response => {
+                    resolve(response)
+                }).catch((error) => {
+                    reject(error)
+            })
+        });    
+    },
+
+    axiosPut(url, data) {
+        return new Promise((resolve, reject) => {
+            axios.put(url, data).then(response => {
+                    resolve(response)
+                }).catch((error) => {
+                    reject(error)
+            })
+        });    
+    },
+
+    axiosPost(url, data,config) {
+        return new Promise((resolve, reject) => {
+            axios.post(url, data,config).then(response => {
+                    resolve(response)
+                }).catch((error) => {
+                    reject(error)
+            })
+        });    
+    },
+
+    axiosDelete(url, newData) {
+        return new Promise((resolve, reject) => {
+            axios.delete(url,{data:newData}).then(response => {
+                    resolve(response)
+                }).catch((error) => {
+                    reject(error)
+            })
+        });    
+    },
+
+ 
+
+
+
+}

src/tool/util.js

@@ -0,0 +1,141 @@
+const isEmail = (email)=>{
+    let  reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
+    let result = reg.test(email)
+    return result
+}
+
+const getUploadUrl = () =>{
+    let url = process.env.VUE_APP_BASE_URL || ''
+    return url
+}	
+ 
+function dataURLtoBlob(dataurl) {
+    var arr = dataurl.split(',');
+    var mime = arr[0].match(/:(.*?);/)[1];
+    var bstr =atob(arr[1]);    
+    var n = bstr.length;     
+    var u8arr =new Uint8Array(n); 
+    while (n--) {
+        u8arr[n] = bstr.charCodeAt(n);
+    }
+    return new Blob([u8arr], {type: mime });
+}
+
+function blobToFile(blob, fileName){
+    blob.lastModifiedDate =new Date();
+    blob.name = fileName;
+    return blob;
+}
+
+function 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);
+    }
+    var blob = dataURLtoBlob(dataurl);
+    return blobToFile(blob, filename);
+}
+
+const base64toFile = (dataurl, filename = 'file') => {
+    let arr = dataurl.split(',')
+    let mime = arr[0].match(/:(.*?);/)[1]
+    let suffix = mime.split('/')[1]
+    let bstr = atob(arr[1])
+    let n = bstr.length
+    let u8arr = new Uint8Array(n)
+    while (n--) {
+        u8arr[n] = bstr.charCodeAt(n)
+    }
+    return new File([u8arr], `${filename}.${suffix}`, {
+        type: mime
+    })
+
+}
+
+function rgbToHsv([R, G, B]) {
+    R /= 255
+    G /= 255
+    B /= 255
+    const max = Math.max(R, G, B)
+    const min = Math.min(R, G, B)
+    const range = max - min
+    let V = max
+    let S = V === 0 ? 0 : range / V
+    let H = 0
+    if (R === V) H = (60 * (G - B)) / range
+    if (G === V) H = 120 + (60 * (B - R)) / range
+    if (B === V) H = 240 + (60 * (R - G)) / range
+   
+    if (range === 0) H = 0
+    if (H < 0) H += 360
+    H = (H / 2) * (256 / 180)
+    S *= 255
+    V *= 255
+
+    H = parseInt(H)
+    S = parseInt(S)
+    V = parseInt(V) 
+    return [H, S, V]
+  }
+
+  const formatTime = (timestamp, fmt) =>{
+    // date = new Date(), fmt = 'MM/dd/yyyy';
+    let date = new Date();
+    date.setTime(timestamp * 1000);
+
+    if (!fmt) {
+        formatRule ? (fmt = formatRule) : (fmt = "YYYY-MM-DD hh:mm:ss");
+    }
+    // console.log(formatRule)
+    let o = {
+        'M+': date.getMonth() + 1, // 月份
+        'D+': date.getDate(), // 日
+        'h+': date.getHours(), // 小时
+        'm+': date.getMinutes(), // 分
+        's+': date.getSeconds(), // 秒
+        'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
+        'S+': date.getMilliseconds(), // 毫秒
+        'a': date.getHours() > 12
+            ? 'PM'
+            : 'AM' // 上午还是下午
+    };
+    if (/(Y+)/.test(fmt)) {
+        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
+    }
+    if(/(a)/.test(fmt)&&o['h+']>12){
+        o['h+'] = o['h+'] - 12
+    }
+    for (let k in o) {
+        if (new RegExp('(' + k + ')').test(fmt)) {
+            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1)
+                ? (o[k])
+                : (('00' + o[k]).substr(('' + o[k]).length)));
+        }
+    }
+
+    return fmt;
+}
+
+const isMoible = () => {
+    let is_mobile = navigator.userAgent.toLowerCase().match(/(ipad|ipod|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|wince)/i) != null;
+    if(is_mobile){
+        return true
+    }else{
+        return false
+    }
+}
+
+
+
+export{
+    isEmail,
+    getUploadUrl,
+    dataURLtoFile,
+    blobToFile,
+    base64toFile,
+    rgbToHsv,
+    formatTime,
+    dataURLtoBlob,
+    isMoible,
+}