{"remainingRequest":"D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\源码\\vue-element-admin-master\\src\\components\\ImageCropper\\index.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\源码\\vue-element-admin-master\\src\\components\\ImageCropper\\index.vue","mtime":1649647926000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\源码\\vue-element-admin-master\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCid1c2Ugc3RyaWN0JwppbXBvcnQgcmVxdWVzdCBmcm9tICdAL3V0aWxzL3JlcXVlc3QnCmltcG9ydCBsYW5ndWFnZSBmcm9tICcuL3V0aWxzL2xhbmd1YWdlLmpzJwppbXBvcnQgbWltZXMgZnJvbSAnLi91dGlscy9taW1lcy5qcycKaW1wb3J0IGRhdGEyYmxvYiBmcm9tICcuL3V0aWxzL2RhdGEyYmxvYi5qcycKaW1wb3J0IGVmZmVjdFJpcHBsZSBmcm9tICcuL3V0aWxzL2VmZmVjdFJpcHBsZS5qcycKZXhwb3J0IGRlZmF1bHQgewogIHByb3BzOiB7CiAgICAvLyDln5/vvIzkuIrkvKDmlofku7ZuYW1l77yM6Kem5Y+R5LqL5Lu25Lya5bim5LiK77yI5aaC5p6c5LiA5Liq6aG16Z2i5aSa5Liq5Zu+54mH5LiK5Lyg5o6n5Lu277yM5Y+v5Lul5YGa5Yy65YiGCiAgICBmaWVsZDogewogICAgICB0eXBlOiBTdHJpbmcsCiAgICAgIGRlZmF1bHQ6ICdhdmF0YXInCiAgICB9LAogICAgLy8g5Y6f5ZCNa2V577yM57G75Ly85LqOaWTvvIzop6blj5Hkuovku7bkvJrluKbkuIrvvIjlpoLmnpzkuIDkuKrpobXpnaLlpJrkuKrlm77niYfkuIrkvKDmjqfku7bvvIzlj6/ku6XlgZrljLrliIYKICAgIGtpOiB7CiAgICAgIHR5cGU6IE51bWJlciwKICAgICAgZGVmYXVsdDogMAogICAgfSwKICAgIC8vIOaYvuekuuivpeaOp+S7tuS4juWQpgogICAgdmFsdWU6IHsKICAgICAgdHlwZTogQm9vbGVhbiwKICAgICAgZGVmYXVsdDogdHJ1ZQogICAgfSwKICAgIC8vIOS4iuS8oOWcsOWdgAogICAgdXJsOiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJycKICAgIH0sCiAgICAvLyDlhbbku5bopoHkuIrkvKDmlofku7bpmYTluKbnmoTmlbDmja7vvIzlr7nosaHmoLzlvI8KICAgIHBhcmFtczogewogICAgICB0eXBlOiBPYmplY3QsCiAgICAgIGRlZmF1bHQ6IG51bGwKICAgIH0sCiAgICAvLyBBZGQgY3VzdG9tIGhlYWRlcnMKICAgIGhlYWRlcnM6IHsKICAgICAgdHlwZTogT2JqZWN0LAogICAgICBkZWZhdWx0OiBudWxsCiAgICB9LAogICAgLy8g5Ymq6KOB5Zu+54mH55qE5a69CiAgICB3aWR0aDogewogICAgICB0eXBlOiBOdW1iZXIsCiAgICAgIGRlZmF1bHQ6IDIwMAogICAgfSwKICAgIC8vIOWJquijgeWbvueJh+eahOmrmAogICAgaGVpZ2h0OiB7CiAgICAgIHR5cGU6IE51bWJlciwKICAgICAgZGVmYXVsdDogMjAwCiAgICB9LAogICAgLy8g5LiN5pi+56S65peL6L2s5Yqf6IO9CiAgICBub1JvdGF0ZTogewogICAgICB0eXBlOiBCb29sZWFuLAogICAgICBkZWZhdWx0OiB0cnVlCiAgICB9LAogICAgLy8g5LiN6aKE6KeI5ZyG5b2i5Zu+54mHCiAgICBub0NpcmNsZTogewogICAgICB0eXBlOiBCb29sZWFuLAogICAgICBkZWZhdWx0OiBmYWxzZQogICAgfSwKICAgIC8vIOS4jemihOiniOaWueW9ouWbvueJhwogICAgbm9TcXVhcmU6IHsKICAgICAgdHlwZTogQm9vbGVhbiwKICAgICAgZGVmYXVsdDogZmFsc2UKICAgIH0sCiAgICAvLyDljZXmlofku7blpKflsI/pmZDliLYKICAgIG1heFNpemU6IHsKICAgICAgdHlwZTogTnVtYmVyLAogICAgICBkZWZhdWx0OiAxMDI0MAogICAgfSwKICAgIC8vIOivreiogOexu+WeiwogICAgbGFuZ1R5cGU6IHsKICAgICAgdHlwZTogU3RyaW5nLAogICAgICBkZWZhdWx0OiAnemgnCiAgICB9LAogICAgLy8g6K+t6KiA5YyFCiAgICBsYW5nRXh0OiB7CiAgICAgIHR5cGU6IE9iamVjdCwKICAgICAgZGVmYXVsdDogbnVsbAogICAgfSwKICAgIC8vIOWbvueJh+S4iuS8oOagvOW8jwogICAgaW1nRm9ybWF0OiB7CiAgICAgIHR5cGU6IFN0cmluZywKICAgICAgZGVmYXVsdDogJ3BuZycKICAgIH0sCiAgICAvLyDmmK/lkKbmlK/mjIHot6jln58KICAgIHdpdGhDcmVkZW50aWFsczogewogICAgICB0eXBlOiBCb29sZWFuLAogICAgICBkZWZhdWx0OiBmYWxzZQogICAgfQogIH0sCiAgZGF0YSgpIHsKICAgIGNvbnN0IHsgaW1nRm9ybWF0LCBsYW5nVHlwZSwgbGFuZ0V4dCwgd2lkdGgsIGhlaWdodCB9ID0gdGhpcwogICAgbGV0IGlzU3VwcG9ydGVkID0gdHJ1ZQogICAgY29uc3QgYWxsb3dJbWdGb3JtYXQgPSBbJ2pwZycsICdwbmcnXQogICAgY29uc3QgdGVtcEltZ0Zvcm1hdCA9CiAgICAgIGFsbG93SW1nRm9ybWF0LmluZGV4T2YoaW1nRm9ybWF0KSA9PT0gLTEgPyAnanBnJyA6IGltZ0Zvcm1hdAogICAgY29uc3QgbGFuZyA9IGxhbmd1YWdlW2xhbmdUeXBlXSA/IGxhbmd1YWdlW2xhbmdUeXBlXSA6IGxhbmd1YWdlWydlbiddCiAgICBjb25zdCBtaW1lID0gbWltZXNbdGVtcEltZ0Zvcm1hdF0KICAgIC8vIOinhOiMg+WbvueJh+agvOW8jwogICAgdGhpcy5pbWdGb3JtYXQgPSB0ZW1wSW1nRm9ybWF0CiAgICBpZiAobGFuZ0V4dCkgewogICAgICBPYmplY3QuYXNzaWduKGxhbmcsIGxhbmdFeHQpCiAgICB9CiAgICBpZiAodHlwZW9mIEZvcm1EYXRhICE9PSAnZnVuY3Rpb24nKSB7CiAgICAgIGlzU3VwcG9ydGVkID0gZmFsc2UKICAgIH0KICAgIHJldHVybiB7CiAgICAgIC8vIOWbvueJh+eahG1pbWUKICAgICAgbWltZSwKICAgICAgLy8g6K+t6KiA5YyFCiAgICAgIGxhbmcsCiAgICAgIC8vIOa1j+iniOWZqOaYr+WQpuaUr+aMgeivpeaOp+S7tgogICAgICBpc1N1cHBvcnRlZCwKICAgICAgLy8g5rWP6KeI5Zmo5piv5ZCm5pSv5oyB6Kem5bGP5LqL5Lu2CiAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBuby1wcm90b3R5cGUtYnVpbHRpbnMKICAgICAgaXNTdXBwb3J0VG91Y2g6IGRvY3VtZW50Lmhhc093blByb3BlcnR5KCdvbnRvdWNoc3RhcnQnKSwKICAgICAgLy8g5q2l6aqkCiAgICAgIHN0ZXA6IDEsIC8vIDHpgInmi6nmlofku7YgMuWJquijgSAz5LiK5LygCiAgICAgIC8vIOS4iuS8oOeKtuaAgeWPiui/m+W6pgogICAgICBsb2FkaW5nOiAwLCAvLyAw5pyq5byA5aeLIDHmraPlnKggMuaIkOWKnyAz6ZSZ6K+vCiAgICAgIHByb2dyZXNzOiAwLAogICAgICAvLyDmmK/lkKbmnInplJnor6/lj4rplJnor6/kv6Hmga8KICAgICAgaGFzRXJyb3I6IGZhbHNlLAogICAgICBlcnJvck1zZzogJycsCiAgICAgIC8vIOmcgOaxguWbvuWuvemrmOavlAogICAgICByYXRpbzogd2lkdGggLyBoZWlnaHQsCiAgICAgIC8vIOWOn+WbvuWcsOWdgOOAgeeUn+aIkOWbvueJh+WcsOWdgAogICAgICBzb3VyY2VJbWc6IG51bGwsCiAgICAgIHNvdXJjZUltZ1VybDogJycsCiAgICAgIGNyZWF0ZUltZ1VybDogJycsCiAgICAgIC8vIOWOn+WbvueJh+aLluWKqOS6i+S7tuWIneWni+WAvAogICAgICBzb3VyY2VJbWdNb3VzZURvd246IHsKICAgICAgICBvbjogZmFsc2UsCiAgICAgICAgbVg6IDAsIC8vIOm8oOagh+aMieS4i+eahOWdkOaghwogICAgICAgIG1ZOiAwLAogICAgICAgIHg6IDAsIC8vIHNjYWxl5Y6f5Zu+5Z2Q5qCHCiAgICAgICAgeTogMAogICAgICB9LAogICAgICAvLyDnlJ/miJDlm77niYfpooTop4jnmoTlrrnlmajlpKflsI8KICAgICAgcHJldmlld0NvbnRhaW5lcjogewogICAgICAgIHdpZHRoOiAxMDAsCiAgICAgICAgaGVpZ2h0OiAxMDAKICAgICAgfSwKICAgICAgLy8g5Y6f5Zu+5a655Zmo5a696auYCiAgICAgIHNvdXJjZUltZ0NvbnRhaW5lcjogewogICAgICAgIC8vIHNpYwogICAgICAgIHdpZHRoOiAyNDAsCiAgICAgICAgaGVpZ2h0OiAxODQgLy8g5aaC5p6c55Sf5oiQ5Zu+5q+U5L6L5LiO5q2k5LiA6Ie05Lya5Ye6546wYnVn77yM5YWI5pS55oiQ54m55q6K55qE5qC85byP5ZCn77yM5ZOI5ZOI5ZOICiAgICAgIH0sCiAgICAgIC8vIOWOn+WbvuWxleekuuWxnuaApwogICAgICBzY2FsZTogewogICAgICAgIHpvb21BZGRPbjogZmFsc2UsIC8vIOaMiemSrue8qeaUvuS6i+S7tuW8gOWQrwogICAgICAgIHpvb21TdWJPbjogZmFsc2UsIC8vIOaMiemSrue8qeaUvuS6i+S7tuW8gOWQrwogICAgICAgIHJhbmdlOiAxLCAvLyDmnIDlpKcxMDAKICAgICAgICByb3RhdGVMZWZ0OiBmYWxzZSwgLy8g5oyJ6ZKu5ZCR5bem5peL6L2s5LqL5Lu25byA5ZCvCiAgICAgICAgcm90YXRlUmlnaHQ6IGZhbHNlLCAvLyDmjInpkq7lkJHlj7Pml4vovazkuovku7blvIDlkK8KICAgICAgICBkZWdyZWU6IDAsIC8vIOaXi+i9rOW6puaVsAogICAgICAgIHg6IDAsCiAgICAgICAgeTogMCwKICAgICAgICB3aWR0aDogMCwKICAgICAgICBoZWlnaHQ6IDAsCiAgICAgICAgbWF4V2lkdGg6IDAsCiAgICAgICAgbWF4SGVpZ2h0OiAwLAogICAgICAgIG1pbldpZHRoOiAwLCAvLyDmnIDlrr0KICAgICAgICBtaW5IZWlnaHQ6IDAsCiAgICAgICAgbmF0dXJhbFdpZHRoOiAwLCAvLyDljp/lrr0KICAgICAgICBuYXR1cmFsSGVpZ2h0OiAwCiAgICAgIH0KICAgIH0KICB9LAogIGNvbXB1dGVkOiB7CiAgICAvLyDov5vluqbmnaHmoLflvI8KICAgIHByb2dyZXNzU3R5bGUoKSB7CiAgICAgIGNvbnN0IHsgcHJvZ3Jlc3MgfSA9IHRoaXMKICAgICAgcmV0dXJuIHsKICAgICAgICB3aWR0aDogcHJvZ3Jlc3MgKyAnJScKICAgICAgfQogICAgfSwKICAgIC8vIOWOn+Wbvuagt+W8jwogICAgc291cmNlSW1nU3R5bGUoKSB7CiAgICAgIGNvbnN0IHsgc2NhbGUsIHNvdXJjZUltZ01hc2tpbmcgfSA9IHRoaXMKICAgICAgY29uc3QgdG9wID0gc2NhbGUueSArIHNvdXJjZUltZ01hc2tpbmcueSArICdweCcKICAgICAgY29uc3QgbGVmdCA9IHNjYWxlLnggKyBzb3VyY2VJbWdNYXNraW5nLnggKyAncHgnCiAgICAgIHJldHVybiB7CiAgICAgICAgdG9wLAogICAgICAgIGxlZnQsCiAgICAgICAgd2lkdGg6IHNjYWxlLndpZHRoICsgJ3B4JywKICAgICAgICBoZWlnaHQ6IHNjYWxlLmhlaWdodCArICdweCcsCiAgICAgICAgdHJhbnNmb3JtOiAncm90YXRlKCcgKyBzY2FsZS5kZWdyZWUgKyAnZGVnKScsIC8vIOaXi+i9rOaXtiDlt6bkvqfljp/lp4vlm77ml4vovazmoLflvI8KICAgICAgICAnLW1zLXRyYW5zZm9ybSc6ICdyb3RhdGUoJyArIHNjYWxlLmRlZ3JlZSArICdkZWcpJywgLy8g5YW85a65SUU5CiAgICAgICAgJy1tb3otdHJhbnNmb3JtJzogJ3JvdGF0ZSgnICsgc2NhbGUuZGVncmVlICsgJ2RlZyknLCAvLyDlhbzlrrlGaXJlRm94CiAgICAgICAgJy13ZWJraXQtdHJhbnNmb3JtJzogJ3JvdGF0ZSgnICsgc2NhbGUuZGVncmVlICsgJ2RlZyknLCAvLyDlhbzlrrlTYWZhcmkg5ZKMIGNocm9tZQogICAgICAgICctby10cmFuc2Zvcm0nOiAncm90YXRlKCcgKyBzY2FsZS5kZWdyZWUgKyAnZGVnKScgLy8g5YW85a65IE9wZXJhCiAgICAgIH0KICAgIH0sCiAgICAvLyDljp/lm77okpnniYjlsZ7mgKcKICAgIHNvdXJjZUltZ01hc2tpbmcoKSB7CiAgICAgIGNvbnN0IHsgd2lkdGgsIGhlaWdodCwgcmF0aW8sIHNvdXJjZUltZ0NvbnRhaW5lciB9ID0gdGhpcwogICAgICBjb25zdCBzaWMgPSBzb3VyY2VJbWdDb250YWluZXIKICAgICAgY29uc3Qgc2ljUmF0aW8gPSBzaWMud2lkdGggLyBzaWMuaGVpZ2h0IC8vIOWOn+WbvuWuueWZqOWuvemrmOavlAogICAgICBsZXQgeCA9IDAKICAgICAgbGV0IHkgPSAwCiAgICAgIGxldCB3ID0gc2ljLndpZHRoCiAgICAgIGxldCBoID0gc2ljLmhlaWdodAogICAgICBsZXQgc2NhbGUgPSAxCiAgICAgIGlmIChyYXRpbyA8IHNpY1JhdGlvKSB7CiAgICAgICAgc2NhbGUgPSBzaWMuaGVpZ2h0IC8gaGVpZ2h0CiAgICAgICAgdyA9IHNpYy5oZWlnaHQgKiByYXRpbwogICAgICAgIHggPSAoc2ljLndpZHRoIC0gdykgLyAyCiAgICAgIH0KICAgICAgaWYgKHJhdGlvID4gc2ljUmF0aW8pIHsKICAgICAgICBzY2FsZSA9IHNpYy53aWR0aCAvIHdpZHRoCiAgICAgICAgaCA9IHNpYy53aWR0aCAvIHJhdGlvCiAgICAgICAgeSA9IChzaWMuaGVpZ2h0IC0gaCkgLyAyCiAgICAgIH0KICAgICAgcmV0dXJuIHsKICAgICAgICBzY2FsZSwgLy8g6JKZ54mI55u45a+56ZyA5rGC5a696auY55qE57yp5pS+CiAgICAgICAgeCwKICAgICAgICB5LAogICAgICAgIHdpZHRoOiB3LAogICAgICAgIGhlaWdodDogaAogICAgICB9CiAgICB9LAogICAgLy8g5Y6f5Zu+6YGu572p5qC35byPCiAgICBzb3VyY2VJbWdTaGFkZVN0eWxlKCkgewogICAgICBjb25zdCB7IHNvdXJjZUltZ01hc2tpbmcsIHNvdXJjZUltZ0NvbnRhaW5lciB9ID0gdGhpcwogICAgICBjb25zdCBzaWMgPSBzb3VyY2VJbWdDb250YWluZXIKICAgICAgY29uc3Qgc2ltID0gc291cmNlSW1nTWFza2luZwogICAgICBjb25zdCB3ID0KICAgICAgICBzaW0ud2lkdGggPT09IHNpYy53aWR0aCA/IHNpbS53aWR0aCA6IChzaWMud2lkdGggLSBzaW0ud2lkdGgpIC8gMgogICAgICBjb25zdCBoID0KICAgICAgICBzaW0uaGVpZ2h0ID09PSBzaWMuaGVpZ2h0ID8gc2ltLmhlaWdodCA6IChzaWMuaGVpZ2h0IC0gc2ltLmhlaWdodCkgLyAyCiAgICAgIHJldHVybiB7CiAgICAgICAgd2lkdGg6IHcgKyAncHgnLAogICAgICAgIGhlaWdodDogaCArICdweCcKICAgICAgfQogICAgfSwKICAgIHByZXZpZXdTdHlsZSgpIHsKICAgICAgY29uc3QgeyByYXRpbywgcHJldmlld0NvbnRhaW5lciB9ID0gdGhpcwogICAgICBjb25zdCBwYyA9IHByZXZpZXdDb250YWluZXIKICAgICAgbGV0IHcgPSBwYy53aWR0aAogICAgICBsZXQgaCA9IHBjLmhlaWdodAogICAgICBjb25zdCBwY1JhdGlvID0gdyAvIGgKICAgICAgaWYgKHJhdGlvIDwgcGNSYXRpbykgewogICAgICAgIHcgPSBwYy5oZWlnaHQgKiByYXRpbwogICAgICB9CiAgICAgIGlmIChyYXRpbyA+IHBjUmF0aW8pIHsKICAgICAgICBoID0gcGMud2lkdGggLyByYXRpbwogICAgICB9CiAgICAgIHJldHVybiB7CiAgICAgICAgd2lkdGg6IHcgKyAncHgnLAogICAgICAgIGhlaWdodDogaCArICdweCcKICAgICAgfQogICAgfQogIH0sCiAgd2F0Y2g6IHsKICAgIHZhbHVlKG5ld1ZhbHVlKSB7CiAgICAgIGlmIChuZXdWYWx1ZSAmJiB0aGlzLmxvYWRpbmcgIT09IDEpIHsKICAgICAgICB0aGlzLnJlc2V0KCkKICAgICAgfQogICAgfQogIH0sCiAgY3JlYXRlZCgpIHsKICAgIC8vIOe7keWumuaMiemUrmVzY+makOiXj+atpOaPkuS7tuS6i+S7tgogICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcigna2V5dXAnLCB0aGlzLmNsb3NlSGFuZGxlcikKICB9LAogIGRlc3Ryb3llZCgpIHsKICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2tleXVwJywgdGhpcy5jbG9zZUhhbmRsZXIpCiAgfSwKICBtZXRob2RzOiB7CiAgICAvLyDngrnlh7vms6LnurnmlYjmnpwKICAgIHJpcHBsZShlKSB7CiAgICAgIGVmZmVjdFJpcHBsZShlKQogICAgfSwKICAgIC8vIOWFs+mXreaOp+S7tgogICAgb2ZmKCkgewogICAgICBzZXRUaW1lb3V0KCgpID0+IHsKICAgICAgICB0aGlzLiRlbWl0KCdpbnB1dCcsIGZhbHNlKQogICAgICAgIHRoaXMuJGVtaXQoJ2Nsb3NlJykKICAgICAgICBpZiAodGhpcy5zdGVwID09PSAzICYmIHRoaXMubG9hZGluZyA9PT0gMikgewogICAgICAgICAgdGhpcy5zZXRTdGVwKDEpCiAgICAgICAgfQogICAgICB9LCAyMDApCiAgICB9LAogICAgLy8g6K6+572u5q2l6aqkCiAgICBzZXRTdGVwKG5vKSB7CiAgICAgIC8vIOW7tuaXtuaYr+S4uuS6huaYvuekuuWKqOeUu+aViOaenOWRou+8jOWTiOWTiOWTiAogICAgICBzZXRUaW1lb3V0KCgpID0+IHsKICAgICAgICB0aGlzLnN0ZXAgPSBubwogICAgICB9LCAyMDApCiAgICB9LAogICAgLyog5Zu+54mH6YCJ5oup5Yy65Z+f5Ye95pWw57uR5a6aCiAgICAgLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tKi8KICAgIHByZXZlbnREZWZhdWx0KGUpIHsKICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpCiAgICAgIHJldHVybiBmYWxzZQogICAgfSwKICAgIGhhbmRsZUNsaWNrKGUpIHsKICAgICAgaWYgKHRoaXMubG9hZGluZyAhPT0gMSkgewogICAgICAgIGlmIChlLnRhcmdldCAhPT0gdGhpcy4kcmVmcy5maWxlaW5wdXQpIHsKICAgICAgICAgIGUucHJldmVudERlZmF1bHQoKQogICAgICAgICAgaWYgKGRvY3VtZW50LmFjdGl2ZUVsZW1lbnQgIT09IHRoaXMuJHJlZnMpIHsKICAgICAgICAgICAgdGhpcy4kcmVmcy5maWxlaW5wdXQuY2xpY2soKQogICAgICAgICAgfQogICAgICAgIH0KICAgICAgfQogICAgfSwKICAgIGhhbmRsZUNoYW5nZShlKSB7CiAgICAgIGUucHJldmVudERlZmF1bHQoKQogICAgICBpZiAodGhpcy5sb2FkaW5nICE9PSAxKSB7CiAgICAgICAgY29uc3QgZmlsZXMgPSBlLnRhcmdldC5maWxlcyB8fCBlLmRhdGFUcmFuc2Zlci5maWxlcwogICAgICAgIHRoaXMucmVzZXQoKQogICAgICAgIGlmICh0aGlzLmNoZWNrRmlsZShmaWxlc1swXSkpIHsKICAgICAgICAgIHRoaXMuc2V0U291cmNlSW1nKGZpbGVzWzBdKQogICAgICAgIH0KICAgICAgfQogICAgfSwKICAgIC8qIC0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLSovCiAgICAvLyDmo4DmtYvpgInmi6nnmoTmlofku7bmmK/lkKblkIjpgIIKICAgIGNoZWNrRmlsZShmaWxlKSB7CiAgICAgIGNvbnN0IHsgbGFuZywgbWF4U2l6ZSB9ID0gdGhpcwogICAgICAvLyDku4XpmZDlm77niYcKICAgICAgaWYgKGZpbGUudHlwZS5pbmRleE9mKCdpbWFnZScpID09PSAtMSkgewogICAgICAgIHRoaXMuaGFzRXJyb3IgPSB0cnVlCiAgICAgICAgdGhpcy5lcnJvck1zZyA9IGxhbmcuZXJyb3Iub25seUltZwogICAgICAgIHJldHVybiBmYWxzZQogICAgICB9CiAgICAgIC8vIOi2heWHuuWkp+WwjwogICAgICBpZiAoZmlsZS5zaXplIC8gMTAyNCA+IG1heFNpemUpIHsKICAgICAgICB0aGlzLmhhc0Vycm9yID0gdHJ1ZQogICAgICAgIHRoaXMuZXJyb3JNc2cgPSBsYW5nLmVycm9yLm91dE9mU2l6ZSArIG1heFNpemUgKyAna2InCiAgICAgICAgcmV0dXJuIGZhbHNlCiAgICAgIH0KICAgICAgcmV0dXJuIHRydWUKICAgIH0sCiAgICAvLyDph43nva7mjqfku7YKICAgIHJlc2V0KCkgewogICAgICB0aGlzLmxvYWRpbmcgPSAwCiAgICAgIHRoaXMuaGFzRXJyb3IgPSBmYWxzZQogICAgICB0aGlzLmVycm9yTXNnID0gJycKICAgICAgdGhpcy5wcm9ncmVzcyA9IDAKICAgIH0sCiAgICAvLyDorr7nva7lm77niYfmupAKICAgIHNldFNvdXJjZUltZyhmaWxlKSB7CiAgICAgIGNvbnN0IGZyID0gbmV3IEZpbGVSZWFkZXIoKQogICAgICBmci5vbmxvYWQgPSBlID0+IHsKICAgICAgICB0aGlzLnNvdXJjZUltZ1VybCA9IGZyLnJlc3VsdAogICAgICAgIHRoaXMuc3RhcnRDcm9wKCkKICAgICAgfQogICAgICBmci5yZWFkQXNEYXRhVVJMKGZpbGUpCiAgICB9LAogICAgLy8g5Ymq6KOB5YmN5YeG5aSH5bel5L2cCiAgICBzdGFydENyb3AoKSB7CiAgICAgIGNvbnN0IHsKICAgICAgICB3aWR0aCwKICAgICAgICBoZWlnaHQsCiAgICAgICAgcmF0aW8sCiAgICAgICAgc2NhbGUsCiAgICAgICAgc291cmNlSW1nVXJsLAogICAgICAgIHNvdXJjZUltZ01hc2tpbmcsCiAgICAgICAgbGFuZwogICAgICB9ID0gdGhpcwogICAgICBjb25zdCBzaW0gPSBzb3VyY2VJbWdNYXNraW5nCiAgICAgIGNvbnN0IGltZyA9IG5ldyBJbWFnZSgpCiAgICAgIGltZy5zcmMgPSBzb3VyY2VJbWdVcmwKICAgICAgaW1nLm9ubG9hZCA9ICgpID0+IHsKICAgICAgICBjb25zdCBuV2lkdGggPSBpbWcubmF0dXJhbFdpZHRoCiAgICAgICAgY29uc3QgbkhlaWdodCA9IGltZy5uYXR1cmFsSGVpZ2h0CiAgICAgICAgY29uc3QgblJhdGlvID0gbldpZHRoIC8gbkhlaWdodAogICAgICAgIGxldCB3ID0gc2ltLndpZHRoCiAgICAgICAgbGV0IGggPSBzaW0uaGVpZ2h0CiAgICAgICAgbGV0IHggPSAwCiAgICAgICAgbGV0IHkgPSAwCiAgICAgICAgLy8g5Zu+54mH5YOP57Sg5LiN6L6+5qCHCiAgICAgICAgaWYgKG5XaWR0aCA8IHdpZHRoIHx8IG5IZWlnaHQgPCBoZWlnaHQpIHsKICAgICAgICAgIHRoaXMuaGFzRXJyb3IgPSB0cnVlCiAgICAgICAgICB0aGlzLmVycm9yTXNnID0gbGFuZy5lcnJvci5sb3dlc3RQeCArIHdpZHRoICsgJyonICsgaGVpZ2h0CiAgICAgICAgICByZXR1cm4gZmFsc2UKICAgICAgICB9CiAgICAgICAgaWYgKHJhdGlvID4gblJhdGlvKSB7CiAgICAgICAgICBoID0gdyAvIG5SYXRpbwogICAgICAgICAgeSA9IChzaW0uaGVpZ2h0IC0gaCkgLyAyCiAgICAgICAgfQogICAgICAgIGlmIChyYXRpbyA8IG5SYXRpbykgewogICAgICAgICAgdyA9IGggKiBuUmF0aW8KICAgICAgICAgIHggPSAoc2ltLndpZHRoIC0gdykgLyAyCiAgICAgICAgfQogICAgICAgIHNjYWxlLnJhbmdlID0gMAogICAgICAgIHNjYWxlLnggPSB4CiAgICAgICAgc2NhbGUueSA9IHkKICAgICAgICBzY2FsZS53aWR0aCA9IHcKICAgICAgICBzY2FsZS5oZWlnaHQgPSBoCiAgICAgICAgc2NhbGUuZGVncmVlID0gMAogICAgICAgIHNjYWxlLm1pbldpZHRoID0gdwogICAgICAgIHNjYWxlLm1pbkhlaWdodCA9IGgKICAgICAgICBzY2FsZS5tYXhXaWR0aCA9IG5XaWR0aCAqIHNpbS5zY2FsZQogICAgICAgIHNjYWxlLm1heEhlaWdodCA9IG5IZWlnaHQgKiBzaW0uc2NhbGUKICAgICAgICBzY2FsZS5uYXR1cmFsV2lkdGggPSBuV2lkdGgKICAgICAgICBzY2FsZS5uYXR1cmFsSGVpZ2h0ID0gbkhlaWdodAogICAgICAgIHRoaXMuc291cmNlSW1nID0gaW1nCiAgICAgICAgdGhpcy5jcmVhdGVJbWcoKQogICAgICAgIHRoaXMuc2V0U3RlcCgyKQogICAgICB9CiAgICB9LAogICAgLy8g6byg5qCH5oyJ5LiL5Zu+54mH5YeG5aSH56e75YqoCiAgICBpbWdTdGFydE1vdmUoZSkgewogICAgICBlLnByZXZlbnREZWZhdWx0KCkKICAgICAgLy8g5pSv5oyB6Kem5pG45LqL5Lu277yM5YiZ6byg5qCH5LqL5Lu25peg5pWICiAgICAgIGlmICh0aGlzLmlzU3VwcG9ydFRvdWNoICYmICFlLnRhcmdldFRvdWNoZXMpIHsKICAgICAgICByZXR1cm4gZmFsc2UKICAgICAgfQogICAgICBjb25zdCBldCA9IGUudGFyZ2V0VG91Y2hlcyA/IGUudGFyZ2V0VG91Y2hlc1swXSA6IGUKICAgICAgY29uc3QgeyBzb3VyY2VJbWdNb3VzZURvd24sIHNjYWxlIH0gPSB0aGlzCiAgICAgIGNvbnN0IHNpbWQgPSBzb3VyY2VJbWdNb3VzZURvd24KICAgICAgc2ltZC5tWCA9IGV0LnNjcmVlblgKICAgICAgc2ltZC5tWSA9IGV0LnNjcmVlblkKICAgICAgc2ltZC54ID0gc2NhbGUueAogICAgICBzaW1kLnkgPSBzY2FsZS55CiAgICAgIHNpbWQub24gPSB0cnVlCiAgICB9LAogICAgLy8g6byg5qCH5oyJ5LiL54q25oCB5LiL56e75Yqo77yM5Zu+54mH56e75YqoCiAgICBpbWdNb3ZlKGUpIHsKICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpCiAgICAgIC8vIOaUr+aMgeinpuaRuOS6i+S7tu+8jOWImem8oOagh+S6i+S7tuaXoOaViAogICAgICBpZiAodGhpcy5pc1N1cHBvcnRUb3VjaCAmJiAhZS50YXJnZXRUb3VjaGVzKSB7CiAgICAgICAgcmV0dXJuIGZhbHNlCiAgICAgIH0KICAgICAgY29uc3QgZXQgPSBlLnRhcmdldFRvdWNoZXMgPyBlLnRhcmdldFRvdWNoZXNbMF0gOiBlCiAgICAgIGNvbnN0IHsKICAgICAgICBzb3VyY2VJbWdNb3VzZURvd246IHsgb24sIG1YLCBtWSwgeCwgeSB9LAogICAgICAgIHNjYWxlLAogICAgICAgIHNvdXJjZUltZ01hc2tpbmcKICAgICAgfSA9IHRoaXMKICAgICAgY29uc3Qgc2ltID0gc291cmNlSW1nTWFza2luZwogICAgICBjb25zdCBuWCA9IGV0LnNjcmVlblgKICAgICAgY29uc3QgblkgPSBldC5zY3JlZW5ZCiAgICAgIGNvbnN0IGRYID0gblggLSBtWAogICAgICBjb25zdCBkWSA9IG5ZIC0gbVkKICAgICAgbGV0IHJYID0geCArIGRYCiAgICAgIGxldCByWSA9IHkgKyBkWQogICAgICBpZiAoIW9uKSByZXR1cm4KICAgICAgaWYgKHJYID4gMCkgewogICAgICAgIHJYID0gMAogICAgICB9CiAgICAgIGlmIChyWSA+IDApIHsKICAgICAgICByWSA9IDAKICAgICAgfQogICAgICBpZiAoclggPCBzaW0ud2lkdGggLSBzY2FsZS53aWR0aCkgewogICAgICAgIHJYID0gc2ltLndpZHRoIC0gc2NhbGUud2lkdGgKICAgICAgfQogICAgICBpZiAoclkgPCBzaW0uaGVpZ2h0IC0gc2NhbGUuaGVpZ2h0KSB7CiAgICAgICAgclkgPSBzaW0uaGVpZ2h0IC0gc2NhbGUuaGVpZ2h0CiAgICAgIH0KICAgICAgc2NhbGUueCA9IHJYCiAgICAgIHNjYWxlLnkgPSByWQogICAgfSwKICAgIC8vIOaMiemSruaMieS4i+W8gOWni+WQkeWPs+aXi+i9rAogICAgc3RhcnRSb3RhdGVSaWdodChlKSB7CiAgICAgIGNvbnN0IHsgc2NhbGUgfSA9IHRoaXMKICAgICAgc2NhbGUucm90YXRlUmlnaHQgPSB0cnVlCiAgICAgIGNvbnN0IHJvdGF0ZSA9ICgpID0+IHsKICAgICAgICBpZiAoc2NhbGUucm90YXRlUmlnaHQpIHsKICAgICAgICAgIGNvbnN0IGRlZ3JlZSA9ICsrc2NhbGUuZGVncmVlCiAgICAgICAgICB0aGlzLmNyZWF0ZUltZyhkZWdyZWUpCiAgICAgICAgICBzZXRUaW1lb3V0KGZ1bmN0aW9uKCkgewogICAgICAgICAgICByb3RhdGUoKQogICAgICAgICAgfSwgNjApCiAgICAgICAgfQogICAgICB9CiAgICAgIHJvdGF0ZSgpCiAgICB9LAogICAgLy8g5oyJ6ZKu5oyJ5LiL5byA5aeL5ZCR5bem5peL6L2sCiAgICBzdGFydFJvdGF0ZUxlZnQoZSkgewogICAgICBjb25zdCB7IHNjYWxlIH0gPSB0aGlzCiAgICAgIHNjYWxlLnJvdGF0ZUxlZnQgPSB0cnVlCiAgICAgIGNvbnN0IHJvdGF0ZSA9ICgpID0+IHsKICAgICAgICBpZiAoc2NhbGUucm90YXRlTGVmdCkgewogICAgICAgICAgY29uc3QgZGVncmVlID0gLS1zY2FsZS5kZWdyZWUKICAgICAgICAgIHRoaXMuY3JlYXRlSW1nKGRlZ3JlZSkKICAgICAgICAgIHNldFRpbWVvdXQoZnVuY3Rpb24oKSB7CiAgICAgICAgICAgIHJvdGF0ZSgpCiAgICAgICAgICB9LCA2MCkKICAgICAgICB9CiAgICAgIH0KICAgICAgcm90YXRlKCkKICAgIH0sCiAgICAvLyDlgZzmraLml4vovawKICAgIGVuZFJvdGF0ZSgpIHsKICAgICAgY29uc3QgeyBzY2FsZSB9ID0gdGhpcwogICAgICBzY2FsZS5yb3RhdGVMZWZ0ID0gZmFsc2UKICAgICAgc2NhbGUucm90YXRlUmlnaHQgPSBmYWxzZQogICAgfSwKICAgIC8vIOaMiemSruaMieS4i+W8gOWni+aUvuWkpwogICAgc3RhcnRab29tQWRkKGUpIHsKICAgICAgY29uc3QgeyBzY2FsZSB9ID0gdGhpcwogICAgICBzY2FsZS56b29tQWRkT24gPSB0cnVlCiAgICAgIGNvbnN0IHpvb20gPSAoKSA9PiB7CiAgICAgICAgaWYgKHNjYWxlLnpvb21BZGRPbikgewogICAgICAgICAgY29uc3QgcmFuZ2UgPSBzY2FsZS5yYW5nZSA+PSAxMDAgPyAxMDAgOiArK3NjYWxlLnJhbmdlCiAgICAgICAgICB0aGlzLnpvb21JbWcocmFuZ2UpCiAgICAgICAgICBzZXRUaW1lb3V0KGZ1bmN0aW9uKCkgewogICAgICAgICAgICB6b29tKCkKICAgICAgICAgIH0sIDYwKQogICAgICAgIH0KICAgICAgfQogICAgICB6b29tKCkKICAgIH0sCiAgICAvLyDmjInpkq7mnb7lvIDmiJbnp7vlvIDlj5bmtojmlL7lpKcKICAgIGVuZFpvb21BZGQoZSkgewogICAgICB0aGlzLnNjYWxlLnpvb21BZGRPbiA9IGZhbHNlCiAgICB9LAogICAgLy8g5oyJ6ZKu5oyJ5LiL5byA5aeL57yp5bCPCiAgICBzdGFydFpvb21TdWIoZSkgewogICAgICBjb25zdCB7IHNjYWxlIH0gPSB0aGlzCiAgICAgIHNjYWxlLnpvb21TdWJPbiA9IHRydWUKICAgICAgY29uc3Qgem9vbSA9ICgpID0+IHsKICAgICAgICBpZiAoc2NhbGUuem9vbVN1Yk9uKSB7CiAgICAgICAgICBjb25zdCByYW5nZSA9IHNjYWxlLnJhbmdlIDw9IDAgPyAwIDogLS1zY2FsZS5yYW5nZQogICAgICAgICAgdGhpcy56b29tSW1nKHJhbmdlKQogICAgICAgICAgc2V0VGltZW91dChmdW5jdGlvbigpIHsKICAgICAgICAgICAgem9vbSgpCiAgICAgICAgICB9LCA2MCkKICAgICAgICB9CiAgICAgIH0KICAgICAgem9vbSgpCiAgICB9LAogICAgLy8g5oyJ6ZKu5p2+5byA5oiW56e75byA5Y+W5raI57yp5bCPCiAgICBlbmRab29tU3ViKGUpIHsKICAgICAgY29uc3QgeyBzY2FsZSB9ID0gdGhpcwogICAgICBzY2FsZS56b29tU3ViT24gPSBmYWxzZQogICAgfSwKICAgIHpvb21DaGFuZ2UoZSkgewogICAgICB0aGlzLnpvb21JbWcoZS50YXJnZXQudmFsdWUpCiAgICB9LAogICAgLy8g57yp5pS+5Y6f5Zu+CiAgICB6b29tSW1nKG5ld1JhbmdlKSB7CiAgICAgIGNvbnN0IHsgc291cmNlSW1nTWFza2luZywgc2NhbGUgfSA9IHRoaXMKICAgICAgY29uc3QgewogICAgICAgIG1heFdpZHRoLAogICAgICAgIG1heEhlaWdodCwKICAgICAgICBtaW5XaWR0aCwKICAgICAgICBtaW5IZWlnaHQsCiAgICAgICAgd2lkdGgsCiAgICAgICAgaGVpZ2h0LAogICAgICAgIHgsCiAgICAgICAgeQogICAgICB9ID0gc2NhbGUKICAgICAgY29uc3Qgc2ltID0gc291cmNlSW1nTWFza2luZwogICAgICAvLyDokpnniYjlrr3pq5gKICAgICAgY29uc3Qgc1dpZHRoID0gc2ltLndpZHRoCiAgICAgIGNvbnN0IHNIZWlnaHQgPSBzaW0uaGVpZ2h0CiAgICAgIC8vIOaWsOWuvemrmAogICAgICBjb25zdCBuV2lkdGggPSBtaW5XaWR0aCArICgobWF4V2lkdGggLSBtaW5XaWR0aCkgKiBuZXdSYW5nZSkgLyAxMDAKICAgICAgY29uc3QgbkhlaWdodCA9IG1pbkhlaWdodCArICgobWF4SGVpZ2h0IC0gbWluSGVpZ2h0KSAqIG5ld1JhbmdlKSAvIDEwMAogICAgICAvLyDmlrDlnZDmoIfvvIjmoLnmja7okpnniYjkuK3lv4PngrnnvKnmlL7vvIkKICAgICAgbGV0IG5YID0gc1dpZHRoIC8gMiAtIChuV2lkdGggLyB3aWR0aCkgKiAoc1dpZHRoIC8gMiAtIHgpCiAgICAgIGxldCBuWSA9IHNIZWlnaHQgLyAyIC0gKG5IZWlnaHQgLyBoZWlnaHQpICogKHNIZWlnaHQgLyAyIC0geSkKICAgICAgLy8g5Yik5pat5paw5Z2Q5qCH5piv5ZCm6LaF6L+H6JKZ54mI6ZmQ5Yi2CiAgICAgIGlmIChuWCA+IDApIHsKICAgICAgICBuWCA9IDAKICAgICAgfQogICAgICBpZiAoblkgPiAwKSB7CiAgICAgICAgblkgPSAwCiAgICAgIH0KICAgICAgaWYgKG5YIDwgc1dpZHRoIC0gbldpZHRoKSB7CiAgICAgICAgblggPSBzV2lkdGggLSBuV2lkdGgKICAgICAgfQogICAgICBpZiAoblkgPCBzSGVpZ2h0IC0gbkhlaWdodCkgewogICAgICAgIG5ZID0gc0hlaWdodCAtIG5IZWlnaHQKICAgICAgfQogICAgICAvLyDotYvlgLzlpITnkIYKICAgICAgc2NhbGUueCA9IG5YCiAgICAgIHNjYWxlLnkgPSBuWQogICAgICBzY2FsZS53aWR0aCA9IG5XaWR0aAogICAgICBzY2FsZS5oZWlnaHQgPSBuSGVpZ2h0CiAgICAgIHNjYWxlLnJhbmdlID0gbmV3UmFuZ2UKICAgICAgc2V0VGltZW91dCgoKSA9PiB7CiAgICAgICAgaWYgKHNjYWxlLnJhbmdlID09PSBuZXdSYW5nZSkgewogICAgICAgICAgdGhpcy5jcmVhdGVJbWcoKQogICAgICAgIH0KICAgICAgfSwgMzAwKQogICAgfSwKICAgIC8vIOeUn+aIkOmcgOaxguWbvueJhwogICAgY3JlYXRlSW1nKGUpIHsKICAgICAgY29uc3QgewogICAgICAgIG1pbWUsCiAgICAgICAgc291cmNlSW1nLAogICAgICAgIHNjYWxlOiB7IHgsIHksIHdpZHRoLCBoZWlnaHQsIGRlZ3JlZSB9LAogICAgICAgIHNvdXJjZUltZ01hc2tpbmc6IHsgc2NhbGUgfQogICAgICB9ID0gdGhpcwogICAgICBjb25zdCBjYW52YXMgPSB0aGlzLiRyZWZzLmNhbnZhcwogICAgICBjb25zdCBjdHggPSBjYW52YXMuZ2V0Q29udGV4dCgnMmQnKQogICAgICBpZiAoZSkgewogICAgICAgIC8vIOWPlua2iOm8oOagh+aMieS4i+enu+WKqOeKtuaAgQogICAgICAgIHRoaXMuc291cmNlSW1nTW91c2VEb3duLm9uID0gZmFsc2UKICAgICAgfQogICAgICBjYW52YXMud2lkdGggPSB0aGlzLndpZHRoCiAgICAgIGNhbnZhcy5oZWlnaHQgPSB0aGlzLmhlaWdodAogICAgICBjdHguY2xlYXJSZWN0KDAsIDAsIHRoaXMud2lkdGgsIHRoaXMuaGVpZ2h0KQogICAgICAvLyDlsIbpgI/mmI7ljLrln5/orr7nva7kuLrnmb3oibLlupXovrkKICAgICAgY3R4LmZpbGxTdHlsZSA9ICcjZmZmJwogICAgICBjdHguZmlsbFJlY3QoMCwgMCwgdGhpcy53aWR0aCwgdGhpcy5oZWlnaHQpCiAgICAgIGN0eC50cmFuc2xhdGUodGhpcy53aWR0aCAqIDAuNSwgdGhpcy5oZWlnaHQgKiAwLjUpCiAgICAgIGN0eC5yb3RhdGUoKE1hdGguUEkgKiBkZWdyZWUpIC8gMTgwKQogICAgICBjdHgudHJhbnNsYXRlKC10aGlzLndpZHRoICogMC41LCAtdGhpcy5oZWlnaHQgKiAwLjUpCiAgICAgIGN0eC5kcmF3SW1hZ2UoCiAgICAgICAgc291cmNlSW1nLAogICAgICAgIHggLyBzY2FsZSwKICAgICAgICB5IC8gc2NhbGUsCiAgICAgICAgd2lkdGggLyBzY2FsZSwKICAgICAgICBoZWlnaHQgLyBzY2FsZQogICAgICApCiAgICAgIHRoaXMuY3JlYXRlSW1nVXJsID0gY2FudmFzLnRvRGF0YVVSTChtaW1lKQogICAgfSwKICAgIHByZXBhcmVVcGxvYWQoKSB7CiAgICAgIGNvbnN0IHsgdXJsLCBjcmVhdGVJbWdVcmwsIGZpZWxkLCBraSB9ID0gdGhpcwogICAgICB0aGlzLiRlbWl0KCdjcm9wLXN1Y2Nlc3MnLCBjcmVhdGVJbWdVcmwsIGZpZWxkLCBraSkKICAgICAgaWYgKHR5cGVvZiB1cmwgPT09ICdzdHJpbmcnICYmIHVybCkgewogICAgICAgIHRoaXMudXBsb2FkKCkKICAgICAgfSBlbHNlIHsKICAgICAgICB0aGlzLm9mZigpCiAgICAgIH0KICAgIH0sCiAgICAvLyDkuIrkvKDlm77niYcKICAgIHVwbG9hZCgpIHsKICAgICAgY29uc3QgewogICAgICAgIGxhbmcsCiAgICAgICAgaW1nRm9ybWF0LAogICAgICAgIG1pbWUsCiAgICAgICAgdXJsLAogICAgICAgIHBhcmFtcywKICAgICAgICBmaWVsZCwKICAgICAgICBraSwKICAgICAgICBjcmVhdGVJbWdVcmwKICAgICAgfSA9IHRoaXMKICAgICAgY29uc3QgZm1EYXRhID0gbmV3IEZvcm1EYXRhKCkKICAgICAgZm1EYXRhLmFwcGVuZCgKICAgICAgICBmaWVsZCwKICAgICAgICBkYXRhMmJsb2IoY3JlYXRlSW1nVXJsLCBtaW1lKSwKICAgICAgICBmaWVsZCArICcuJyArIGltZ0Zvcm1hdAogICAgICApCiAgICAgIC8vIOa3u+WKoOWFtuS7luWPguaVsAogICAgICBpZiAodHlwZW9mIHBhcmFtcyA9PT0gJ29iamVjdCcgJiYgcGFyYW1zKSB7CiAgICAgICAgT2JqZWN0LmtleXMocGFyYW1zKS5mb3JFYWNoKGsgPT4gewogICAgICAgICAgZm1EYXRhLmFwcGVuZChrLCBwYXJhbXNba10pCiAgICAgICAgfSkKICAgICAgfQogICAgICAvLyDnm5HlkKzov5vluqblm57osIMKICAgICAgLy8gY29uc3QgdXBsb2FkUHJvZ3Jlc3MgPSAoZXZlbnQpID0+IHsKICAgICAgLy8gICBpZiAoZXZlbnQubGVuZ3RoQ29tcHV0YWJsZSkgewogICAgICAvLyAgICAgdGhpcy5wcm9ncmVzcyA9IDEwMCAqIE1hdGgucm91bmQoZXZlbnQubG9hZGVkKSAvIGV2ZW50LnRvdGFsCiAgICAgIC8vICAgfQogICAgICAvLyB9CiAgICAgIC8vIOS4iuS8oOaWh+S7tgogICAgICB0aGlzLnJlc2V0KCkKICAgICAgdGhpcy5sb2FkaW5nID0gMQogICAgICB0aGlzLnNldFN0ZXAoMykKICAgICAgcmVxdWVzdCh7CiAgICAgICAgdXJsLAogICAgICAgIG1ldGhvZDogJ3Bvc3QnLAogICAgICAgIGRhdGE6IGZtRGF0YQogICAgICB9KQogICAgICAgIC50aGVuKHJlc0RhdGEgPT4gewogICAgICAgICAgdGhpcy5sb2FkaW5nID0gMgogICAgICAgICAgdGhpcy4kZW1pdCgnY3JvcC11cGxvYWQtc3VjY2VzcycsIHJlc0RhdGEuZGF0YSkKICAgICAgICB9KQogICAgICAgIC5jYXRjaChlcnIgPT4gewogICAgICAgICAgaWYgKHRoaXMudmFsdWUpIHsKICAgICAgICAgICAgdGhpcy5sb2FkaW5nID0gMwogICAgICAgICAgICB0aGlzLmhhc0Vycm9yID0gdHJ1ZQogICAgICAgICAgICB0aGlzLmVycm9yTXNnID0gbGFuZy5mYWlsCiAgICAgICAgICAgIHRoaXMuJGVtaXQoJ2Nyb3AtdXBsb2FkLWZhaWwnLCBlcnIsIGZpZWxkLCBraSkKICAgICAgICAgIH0KICAgICAgICB9KQogICAgfSwKICAgIGNsb3NlSGFuZGxlcihlKSB7CiAgICAgIGlmICh0aGlzLnZhbHVlICYmIChlLmtleSA9PT0gJ0VzY2FwZScgfHwgZS5rZXlDb2RlID09PSAyNykpIHsKICAgICAgICB0aGlzLm9mZigpCiAgICAgIH0KICAgIH0KICB9Cn0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/ImageCropper","sourcesContent":["<template>\n <div v-show=\"value\" class=\"vue-image-crop-upload\">\n <div class=\"vicp-wrap\">\n <div class=\"vicp-close\" @click=\"off\">\n <i class=\"vicp-icon4\" />\n </div>\n\n <div v-show=\"step == 1\" class=\"vicp-step1\">\n <div\n class=\"vicp-drop-area\"\n @dragleave=\"preventDefault\"\n @dragover=\"preventDefault\"\n @dragenter=\"preventDefault\"\n @click=\"handleClick\"\n @drop=\"handleChange\"\n >\n <i v-show=\"loading != 1\" class=\"vicp-icon1\">\n <i class=\"vicp-icon1-arrow\" />\n <i class=\"vicp-icon1-body\" />\n <i class=\"vicp-icon1-bottom\" />\n </i>\n <span v-show=\"loading !== 1\" class=\"vicp-hint\">{{ lang.hint }}</span>\n <span v-show=\"!isSupported\" class=\"vicp-no-supported-hint\">{{ lang.noSupported }}</span>\n <input v-show=\"false\" v-if=\"step == 1\" ref=\"fileinput\" type=\"file\" @change=\"handleChange\">\n </div>\n <div v-show=\"hasError\" class=\"vicp-error\">\n <i class=\"vicp-icon2\" />\n {{ errorMsg }}\n </div>\n <div class=\"vicp-operate\">\n <a @click=\"off\" @mousedown=\"ripple\">{{ lang.btn.off }}</a>\n </div>\n </div>\n\n <div v-if=\"step == 2\" class=\"vicp-step2\">\n <div class=\"vicp-crop\">\n <div v-show=\"true\" class=\"vicp-crop-left\">\n <div class=\"vicp-img-container\">\n <img\n ref=\"img\"\n :src=\"sourceImgUrl\"\n :style=\"sourceImgStyle\"\n class=\"vicp-img\"\n draggable=\"false\"\n @drag=\"preventDefault\"\n @dragstart=\"preventDefault\"\n @dragend=\"preventDefault\"\n @dragleave=\"preventDefault\"\n @dragover=\"preventDefault\"\n @dragenter=\"preventDefault\"\n @drop=\"preventDefault\"\n @touchstart=\"imgStartMove\"\n @touchmove=\"imgMove\"\n @touchend=\"createImg\"\n @touchcancel=\"createImg\"\n @mousedown=\"imgStartMove\"\n @mousemove=\"imgMove\"\n @mouseup=\"createImg\"\n @mouseout=\"createImg\"\n >\n <div :style=\"sourceImgShadeStyle\" class=\"vicp-img-shade vicp-img-shade-1\" />\n <div :style=\"sourceImgShadeStyle\" class=\"vicp-img-shade vicp-img-shade-2\" />\n </div>\n\n <div class=\"vicp-range\">\n <input\n :value=\"scale.range\"\n type=\"range\"\n step=\"1\"\n min=\"0\"\n max=\"100\"\n @input=\"zoomChange\"\n >\n <i\n class=\"vicp-icon5\"\n @mousedown=\"startZoomSub\"\n @mouseout=\"endZoomSub\"\n @mouseup=\"endZoomSub\"\n />\n <i\n class=\"vicp-icon6\"\n @mousedown=\"startZoomAdd\"\n @mouseout=\"endZoomAdd\"\n @mouseup=\"endZoomAdd\"\n />\n </div>\n\n <div v-if=\"!noRotate\" class=\"vicp-rotate\">\n <i @mousedown=\"startRotateLeft\" @mouseout=\"endRotate\" @mouseup=\"endRotate\">↺</i>\n <i @mousedown=\"startRotateRight\" @mouseout=\"endRotate\" @mouseup=\"endRotate\">↻</i>\n </div>\n </div>\n <div v-show=\"true\" class=\"vicp-crop-right\">\n <div class=\"vicp-preview\">\n <div v-if=\"!noSquare\" class=\"vicp-preview-item\">\n <img :src=\"createImgUrl\" :style=\"previewStyle\">\n <span>{{ lang.preview }}</span>\n </div>\n <div v-if=\"!noCircle\" class=\"vicp-preview-item vicp-preview-item-circle\">\n <img :src=\"createImgUrl\" :style=\"previewStyle\">\n <span>{{ lang.preview }}</span>\n </div>\n </div>\n </div>\n </div>\n <div class=\"vicp-operate\">\n <a @click=\"setStep(1)\" @mousedown=\"ripple\">{{ lang.btn.back }}</a>\n <a class=\"vicp-operate-btn\" @click=\"prepareUpload\" @mousedown=\"ripple\">{{ lang.btn.save }}</a>\n </div>\n </div>\n\n <div v-if=\"step == 3\" class=\"vicp-step3\">\n <div class=\"vicp-upload\">\n <span v-show=\"loading === 1\" class=\"vicp-loading\">{{ lang.loading }}</span>\n <div class=\"vicp-progress-wrap\">\n <span v-show=\"loading === 1\" :style=\"progressStyle\" class=\"vicp-progress\" />\n </div>\n <div v-show=\"hasError\" class=\"vicp-error\">\n <i class=\"vicp-icon2\" />\n {{ errorMsg }}\n </div>\n <div v-show=\"loading === 2\" class=\"vicp-success\">\n <i class=\"vicp-icon3\" />\n {{ lang.success }}\n </div>\n </div>\n <div class=\"vicp-operate\">\n <a @click=\"setStep(2)\" @mousedown=\"ripple\">{{ lang.btn.back }}</a>\n <a @click=\"off\" @mousedown=\"ripple\">{{ lang.btn.close }}</a>\n </div>\n </div>\n <canvas v-show=\"false\" ref=\"canvas\" :width=\"width\" :height=\"height\" />\n </div>\n </div>\n</template>\n\n<script>\n'use strict'\nimport request from '@/utils/request'\nimport language from './utils/language.js'\nimport mimes from './utils/mimes.js'\nimport data2blob from './utils/data2blob.js'\nimport effectRipple from './utils/effectRipple.js'\nexport default {\n props: {\n // 域，上传文件name，触发事件会带上（如果一个页面多个图片上传控件，可以做区分\n field: {\n type: String,\n default: 'avatar'\n },\n // 原名key，类似于id，触发事件会带上（如果一个页面多个图片上传控件，可以做区分\n ki: {\n type: Number,\n default: 0\n },\n // 显示该控件与否\n value: {\n type: Boolean,\n default: true\n },\n // 上传地址\n url: {\n type: String,\n default: ''\n },\n // 其他要上传文件附带的数据，对象格式\n params: {\n type: Object,\n default: null\n },\n // Add custom headers\n headers: {\n type: Object,\n default: null\n },\n // 剪裁图片的宽\n width: {\n type: Number,\n default: 200\n },\n // 剪裁图片的高\n height: {\n type: Number,\n default: 200\n },\n // 不显示旋转功能\n noRotate: {\n type: Boolean,\n default: true\n },\n // 不预览圆形图片\n noCircle: {\n type: Boolean,\n default: false\n },\n // 不预览方形图片\n noSquare: {\n type: Boolean,\n default: false\n },\n // 单文件大小限制\n maxSize: {\n type: Number,\n default: 10240\n },\n // 语言类型\n langType: {\n type: String,\n default: 'zh'\n },\n // 语言包\n langExt: {\n type: Object,\n default: null\n },\n // 图片上传格式\n imgFormat: {\n type: String,\n default: 'png'\n },\n // 是否支持跨域\n withCredentials: {\n type: Boolean,\n default: false\n }\n },\n data() {\n const { imgFormat, langType, langExt, width, height } = this\n let isSupported = true\n const allowImgFormat = ['jpg', 'png']\n const tempImgFormat =\n allowImgFormat.indexOf(imgFormat) === -1 ? 'jpg' : imgFormat\n const lang = language[langType] ? language[langType] : language['en']\n const mime = mimes[tempImgFormat]\n // 规范图片格式\n this.imgFormat = tempImgFormat\n if (langExt) {\n Object.assign(lang, langExt)\n }\n if (typeof FormData !== 'function') {\n isSupported = false\n }\n return {\n // 图片的mime\n mime,\n // 语言包\n lang,\n // 浏览器是否支持该控件\n isSupported,\n // 浏览器是否支持触屏事件\n // eslint-disable-next-line no-prototype-builtins\n isSupportTouch: document.hasOwnProperty('ontouchstart'),\n // 步骤\n step: 1, // 1选择文件 2剪裁 3上传\n // 上传状态及进度\n loading: 0, // 0未开始 1正在 2成功 3错误\n progress: 0,\n // 是否有错误及错误信息\n hasError: false,\n errorMsg: '',\n // 需求图宽高比\n ratio: width / height,\n // 原图地址、生成图片地址\n sourceImg: null,\n sourceImgUrl: '',\n createImgUrl: '',\n // 原图片拖动事件初始值\n sourceImgMouseDown: {\n on: false,\n mX: 0, // 鼠标按下的坐标\n mY: 0,\n x: 0, // scale原图坐标\n y: 0\n },\n // 生成图片预览的容器大小\n previewContainer: {\n width: 100,\n height: 100\n },\n // 原图容器宽高\n sourceImgContainer: {\n // sic\n width: 240,\n height: 184 // 如果生成图比例与此一致会出现bug，先改成特殊的格式吧，哈哈哈\n },\n // 原图展示属性\n scale: {\n zoomAddOn: false, // 按钮缩放事件开启\n zoomSubOn: false, // 按钮缩放事件开启\n range: 1, // 最大100\n rotateLeft: false, // 按钮向左旋转事件开启\n rotateRight: false, // 按钮向右旋转事件开启\n degree: 0, // 旋转度数\n x: 0,\n y: 0,\n width: 0,\n height: 0,\n maxWidth: 0,\n maxHeight: 0,\n minWidth: 0, // 最宽\n minHeight: 0,\n naturalWidth: 0, // 原宽\n naturalHeight: 0\n }\n }\n },\n computed: {\n // 进度条样式\n progressStyle() {\n const { progress } = this\n return {\n width: progress + '%'\n }\n },\n // 原图样式\n sourceImgStyle() {\n const { scale, sourceImgMasking } = this\n const top = scale.y + sourceImgMasking.y + 'px'\n const left = scale.x + sourceImgMasking.x + 'px'\n return {\n top,\n left,\n width: scale.width + 'px',\n height: scale.height + 'px',\n transform: 'rotate(' + scale.degree + 'deg)', // 旋转时 左侧原始图旋转样式\n '-ms-transform': 'rotate(' + scale.degree + 'deg)', // 兼容IE9\n '-moz-transform': 'rotate(' + scale.degree + 'deg)', // 兼容FireFox\n '-webkit-transform': 'rotate(' + scale.degree + 'deg)', // 兼容Safari 和 chrome\n '-o-transform': 'rotate(' + scale.degree + 'deg)' // 兼容 Opera\n }\n },\n // 原图蒙版属性\n sourceImgMasking() {\n const { width, height, ratio, sourceImgContainer } = this\n const sic = sourceImgContainer\n const sicRatio = sic.width / sic.height // 原图容器宽高比\n let x = 0\n let y = 0\n let w = sic.width\n let h = sic.height\n let scale = 1\n if (ratio < sicRatio) {\n scale = sic.height / height\n w = sic.height * ratio\n x = (sic.width - w) / 2\n }\n if (ratio > sicRatio) {\n scale = sic.width / width\n h = sic.width / ratio\n y = (sic.height - h) / 2\n }\n return {\n scale, // 蒙版相对需求宽高的缩放\n x,\n y,\n width: w,\n height: h\n }\n },\n // 原图遮罩样式\n sourceImgShadeStyle() {\n const { sourceImgMasking, sourceImgContainer } = this\n const sic = sourceImgContainer\n const sim = sourceImgMasking\n const w =\n sim.width === sic.width ? sim.width : (sic.width - sim.width) / 2\n const h =\n sim.height === sic.height ? sim.height : (sic.height - sim.height) / 2\n return {\n width: w + 'px',\n height: h + 'px'\n }\n },\n previewStyle() {\n const { ratio, previewContainer } = this\n const pc = previewContainer\n let w = pc.width\n let h = pc.height\n const pcRatio = w / h\n if (ratio < pcRatio) {\n w = pc.height * ratio\n }\n if (ratio > pcRatio) {\n h = pc.width / ratio\n }\n return {\n width: w + 'px',\n height: h + 'px'\n }\n }\n },\n watch: {\n value(newValue) {\n if (newValue && this.loading !== 1) {\n this.reset()\n }\n }\n },\n created() {\n // 绑定按键esc隐藏此插件事件\n document.addEventListener('keyup', this.closeHandler)\n },\n destroyed() {\n document.removeEventListener('keyup', this.closeHandler)\n },\n methods: {\n // 点击波纹效果\n ripple(e) {\n effectRipple(e)\n },\n // 关闭控件\n off() {\n setTimeout(() => {\n this.$emit('input', false)\n this.$emit('close')\n if (this.step === 3 && this.loading === 2) {\n this.setStep(1)\n }\n }, 200)\n },\n // 设置步骤\n setStep(no) {\n // 延时是为了显示动画效果呢，哈哈哈\n setTimeout(() => {\n this.step = no\n }, 200)\n },\n /* 图片选择区域函数绑定\n ---------------------------------------------------------------*/\n preventDefault(e) {\n e.preventDefault()\n return false\n },\n handleClick(e) {\n if (this.loading !== 1) {\n if (e.target !== this.$refs.fileinput) {\n e.preventDefault()\n if (document.activeElement !== this.$refs) {\n this.$refs.fileinput.click()\n }\n }\n }\n },\n handleChange(e) {\n e.preventDefault()\n if (this.loading !== 1) {\n const files = e.target.files || e.dataTransfer.files\n this.reset()\n if (this.checkFile(files[0])) {\n this.setSourceImg(files[0])\n }\n }\n },\n /* ---------------------------------------------------------------*/\n // 检测选择的文件是否合适\n checkFile(file) {\n const { lang, maxSize } = this\n // 仅限图片\n if (file.type.indexOf('image') === -1) {\n this.hasError = true\n this.errorMsg = lang.error.onlyImg\n return false\n }\n // 超出大小\n if (file.size / 1024 > maxSize) {\n this.hasError = true\n this.errorMsg = lang.error.outOfSize + maxSize + 'kb'\n return false\n }\n return true\n },\n // 重置控件\n reset() {\n this.loading = 0\n this.hasError = false\n this.errorMsg = ''\n this.progress = 0\n },\n // 设置图片源\n setSourceImg(file) {\n const fr = new FileReader()\n fr.onload = e => {\n this.sourceImgUrl = fr.result\n this.startCrop()\n }\n fr.readAsDataURL(file)\n },\n // 剪裁前准备工作\n startCrop() {\n const {\n width,\n height,\n ratio,\n scale,\n sourceImgUrl,\n sourceImgMasking,\n lang\n } = this\n const sim = sourceImgMasking\n const img = new Image()\n img.src = sourceImgUrl\n img.onload = () => {\n const nWidth = img.naturalWidth\n const nHeight = img.naturalHeight\n const nRatio = nWidth / nHeight\n let w = sim.width\n let h = sim.height\n let x = 0\n let y = 0\n // 图片像素不达标\n if (nWidth < width || nHeight < height) {\n this.hasError = true\n this.errorMsg = lang.error.lowestPx + width + '*' + height\n return false\n }\n if (ratio > nRatio) {\n h = w / nRatio\n y = (sim.height - h) / 2\n }\n if (ratio < nRatio) {\n w = h * nRatio\n x = (sim.width - w) / 2\n }\n scale.range = 0\n scale.x = x\n scale.y = y\n scale.width = w\n scale.height = h\n scale.degree = 0\n scale.minWidth = w\n scale.minHeight = h\n scale.maxWidth = nWidth * sim.scale\n scale.maxHeight = nHeight * sim.scale\n scale.naturalWidth = nWidth\n scale.naturalHeight = nHeight\n this.sourceImg = img\n this.createImg()\n this.setStep(2)\n }\n },\n // 鼠标按下图片准备移动\n imgStartMove(e) {\n e.preventDefault()\n // 支持触摸事件，则鼠标事件无效\n if (this.isSupportTouch && !e.targetTouches) {\n return false\n }\n const et = e.targetTouches ? e.targetTouches[0] : e\n const { sourceImgMouseDown, scale } = this\n const simd = sourceImgMouseDown\n simd.mX = et.screenX\n simd.mY = et.screenY\n simd.x = scale.x\n simd.y = scale.y\n simd.on = true\n },\n // 鼠标按下状态下移动，图片移动\n imgMove(e) {\n e.preventDefault()\n // 支持触摸事件，则鼠标事件无效\n if (this.isSupportTouch && !e.targetTouches) {\n return false\n }\n const et = e.targetTouches ? e.targetTouches[0] : e\n const {\n sourceImgMouseDown: { on, mX, mY, x, y },\n scale,\n sourceImgMasking\n } = this\n const sim = sourceImgMasking\n const nX = et.screenX\n const nY = et.screenY\n const dX = nX - mX\n const dY = nY - mY\n let rX = x + dX\n let rY = y + dY\n if (!on) return\n if (rX > 0) {\n rX = 0\n }\n if (rY > 0) {\n rY = 0\n }\n if (rX < sim.width - scale.width) {\n rX = sim.width - scale.width\n }\n if (rY < sim.height - scale.height) {\n rY = sim.height - scale.height\n }\n scale.x = rX\n scale.y = rY\n },\n // 按钮按下开始向右旋转\n startRotateRight(e) {\n const { scale } = this\n scale.rotateRight = true\n const rotate = () => {\n if (scale.rotateRight) {\n const degree = ++scale.degree\n this.createImg(degree)\n setTimeout(function() {\n rotate()\n }, 60)\n }\n }\n rotate()\n },\n // 按钮按下开始向左旋转\n startRotateLeft(e) {\n const { scale } = this\n scale.rotateLeft = true\n const rotate = () => {\n if (scale.rotateLeft) {\n const degree = --scale.degree\n this.createImg(degree)\n setTimeout(function() {\n rotate()\n }, 60)\n }\n }\n rotate()\n },\n // 停止旋转\n endRotate() {\n const { scale } = this\n scale.rotateLeft = false\n scale.rotateRight = false\n },\n // 按钮按下开始放大\n startZoomAdd(e) {\n const { scale } = this\n scale.zoomAddOn = true\n const zoom = () => {\n if (scale.zoomAddOn) {\n const range = scale.range >= 100 ? 100 : ++scale.range\n this.zoomImg(range)\n setTimeout(function() {\n zoom()\n }, 60)\n }\n }\n zoom()\n },\n // 按钮松开或移开取消放大\n endZoomAdd(e) {\n this.scale.zoomAddOn = false\n },\n // 按钮按下开始缩小\n startZoomSub(e) {\n const { scale } = this\n scale.zoomSubOn = true\n const zoom = () => {\n if (scale.zoomSubOn) {\n const range = scale.range <= 0 ? 0 : --scale.range\n this.zoomImg(range)\n setTimeout(function() {\n zoom()\n }, 60)\n }\n }\n zoom()\n },\n // 按钮松开或移开取消缩小\n endZoomSub(e) {\n const { scale } = this\n scale.zoomSubOn = false\n },\n zoomChange(e) {\n this.zoomImg(e.target.value)\n },\n // 缩放原图\n zoomImg(newRange) {\n const { sourceImgMasking, scale } = this\n const {\n maxWidth,\n maxHeight,\n minWidth,\n minHeight,\n width,\n height,\n x,\n y\n } = scale\n const sim = sourceImgMasking\n // 蒙版宽高\n const sWidth = sim.width\n const sHeight = sim.height\n // 新宽高\n const nWidth = minWidth + ((maxWidth - minWidth) * newRange) / 100\n const nHeight = minHeight + ((maxHeight - minHeight) * newRange) / 100\n // 新坐标（根据蒙版中心点缩放）\n let nX = sWidth / 2 - (nWidth / width) * (sWidth / 2 - x)\n let nY = sHeight / 2 - (nHeight / height) * (sHeight / 2 - y)\n // 判断新坐标是否超过蒙版限制\n if (nX > 0) {\n nX = 0\n }\n if (nY > 0) {\n nY = 0\n }\n if (nX < sWidth - nWidth) {\n nX = sWidth - nWidth\n }\n if (nY < sHeight - nHeight) {\n nY = sHeight - nHeight\n }\n // 赋值处理\n scale.x = nX\n scale.y = nY\n scale.width = nWidth\n scale.height = nHeight\n scale.range = newRange\n setTimeout(() => {\n if (scale.range === newRange) {\n this.createImg()\n }\n }, 300)\n },\n // 生成需求图片\n createImg(e) {\n const {\n mime,\n sourceImg,\n scale: { x, y, width, height, degree },\n sourceImgMasking: { scale }\n } = this\n const canvas = this.$refs.canvas\n const ctx = canvas.getContext('2d')\n if (e) {\n // 取消鼠标按下移动状态\n this.sourceImgMouseDown.on = false\n }\n canvas.width = this.width\n canvas.height = this.height\n ctx.clearRect(0, 0, this.width, this.height)\n // 将透明区域设置为白色底边\n ctx.fillStyle = '#fff'\n ctx.fillRect(0, 0, this.width, this.height)\n ctx.translate(this.width * 0.5, this.height * 0.5)\n ctx.rotate((Math.PI * degree) / 180)\n ctx.translate(-this.width * 0.5, -this.height * 0.5)\n ctx.drawImage(\n sourceImg,\n x / scale,\n y / scale,\n width / scale,\n height / scale\n )\n this.createImgUrl = canvas.toDataURL(mime)\n },\n prepareUpload() {\n const { url, createImgUrl, field, ki } = this\n this.$emit('crop-success', createImgUrl, field, ki)\n if (typeof url === 'string' && url) {\n this.upload()\n } else {\n this.off()\n }\n },\n // 上传图片\n upload() {\n const {\n lang,\n imgFormat,\n mime,\n url,\n params,\n field,\n ki,\n createImgUrl\n } = this\n const fmData = new FormData()\n fmData.append(\n field,\n data2blob(createImgUrl, mime),\n field + '.' + imgFormat\n )\n // 添加其他参数\n if (typeof params === 'object' && params) {\n Object.keys(params).forEach(k => {\n fmData.append(k, params[k])\n })\n }\n // 监听进度回调\n // const uploadProgress = (event) => {\n // if (event.lengthComputable) {\n // this.progress = 100 * Math.round(event.loaded) / event.total\n // }\n // }\n // 上传文件\n this.reset()\n this.loading = 1\n this.setStep(3)\n request({\n url,\n method: 'post',\n data: fmData\n })\n .then(resData => {\n this.loading = 2\n this.$emit('crop-upload-success', resData.data)\n })\n .catch(err => {\n if (this.value) {\n this.loading = 3\n this.hasError = true\n this.errorMsg = lang.fail\n this.$emit('crop-upload-fail', err, field, ki)\n }\n })\n },\n closeHandler(e) {\n if (this.value && (e.key === 'Escape' || e.keyCode === 27)) {\n this.off()\n }\n }\n }\n}\n</script>\n\n<style lang=\"scss\">\n@charset \"UTF-8\";\n@-webkit-keyframes vicp_progress {\n 0% {\n background-position-y: 0;\n }\n 100% {\n background-position-y: 40px;\n }\n}\n@keyframes vicp_progress {\n 0% {\n background-position-y: 0;\n }\n 100% {\n background-position-y: 40px;\n }\n}\n@-webkit-keyframes vicp {\n 0% {\n opacity: 0;\n -webkit-transform: scale(0) translatey(-60px);\n transform: scale(0) translatey(-60px);\n }\n 100% {\n opacity: 1;\n -webkit-transform: scale(1) translatey(0);\n transform: scale(1) translatey(0);\n }\n}\n@keyframes vicp {\n 0% {\n opacity: 0;\n -webkit-transform: scale(0) translatey(-60px);\n transform: scale(0) translatey(-60px);\n }\n 100% {\n opacity: 1;\n -webkit-transform: scale(1) translatey(0);\n transform: scale(1) translatey(0);\n }\n}\n.vue-image-crop-upload {\n position: fixed;\n display: block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n z-index: 10000;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.65);\n -webkit-tap-highlight-color: transparent;\n -moz-tap-highlight-color: transparent;\n}\n.vue-image-crop-upload .vicp-wrap {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n position: fixed;\n display: block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n z-index: 10000;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n margin: auto;\n width: 600px;\n height: 330px;\n padding: 25px;\n background-color: #fff;\n border-radius: 2px;\n -webkit-animation: vicp 0.12s ease-in;\n animation: vicp 0.12s ease-in;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-close {\n position: absolute;\n right: -30px;\n top: -30px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-close .vicp-icon4 {\n position: relative;\n display: block;\n width: 30px;\n height: 30px;\n cursor: pointer;\n -webkit-transition: -webkit-transform 0.18s;\n transition: -webkit-transform 0.18s;\n transition: transform 0.18s;\n transition: transform 0.18s, -webkit-transform 0.18s;\n -webkit-transform: rotate(0);\n -ms-transform: rotate(0);\n transform: rotate(0);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-close .vicp-icon4::after,\n.vue-image-crop-upload .vicp-wrap .vicp-close .vicp-icon4::before {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n content: \"\";\n position: absolute;\n top: 12px;\n left: 4px;\n width: 20px;\n height: 3px;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n background-color: #fff;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-close .vicp-icon4::after {\n -webkit-transform: rotate(-45deg);\n -ms-transform: rotate(-45deg);\n transform: rotate(-45deg);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-close .vicp-icon4:hover {\n -webkit-transform: rotate(90deg);\n -ms-transform: rotate(90deg);\n transform: rotate(90deg);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step1 .vicp-drop-area {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 35px;\n height: 170px;\n background-color: rgba(0, 0, 0, 0.03);\n text-align: center;\n border: 1px dashed rgba(0, 0, 0, 0.08);\n overflow: hidden;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step1 .vicp-drop-area .vicp-icon1 {\n display: block;\n margin: 0 auto 6px;\n width: 42px;\n height: 42px;\n overflow: hidden;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step1\n .vicp-drop-area\n .vicp-icon1\n .vicp-icon1-arrow {\n display: block;\n margin: 0 auto;\n width: 0;\n height: 0;\n border-bottom: 14.7px solid rgba(0, 0, 0, 0.3);\n border-left: 14.7px solid transparent;\n border-right: 14.7px solid transparent;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step1\n .vicp-drop-area\n .vicp-icon1\n .vicp-icon1-body {\n display: block;\n width: 12.6px;\n height: 14.7px;\n margin: 0 auto;\n background-color: rgba(0, 0, 0, 0.3);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step1\n .vicp-drop-area\n .vicp-icon1\n .vicp-icon1-bottom {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n display: block;\n height: 12.6px;\n border: 6px solid rgba(0, 0, 0, 0.3);\n border-top: none;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step1 .vicp-drop-area .vicp-hint {\n display: block;\n padding: 15px;\n font-size: 14px;\n color: #666;\n line-height: 30px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step1\n .vicp-drop-area\n .vicp-no-supported-hint {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n padding: 30px;\n width: 100%;\n height: 60px;\n line-height: 30px;\n background-color: #eee;\n text-align: center;\n color: #666;\n font-size: 14px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step1 .vicp-drop-area:hover {\n cursor: pointer;\n border-color: rgba(0, 0, 0, 0.1);\n background-color: rgba(0, 0, 0, 0.05);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step2 .vicp-crop {\n overflow: hidden;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step2 .vicp-crop .vicp-crop-left {\n float: left;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-img-container {\n position: relative;\n display: block;\n width: 240px;\n height: 180px;\n background-color: #e5e5e0;\n overflow: hidden;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-img-container\n .vicp-img {\n position: absolute;\n display: block;\n cursor: move;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-img-container\n .vicp-img-shade {\n -webkit-box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n position: absolute;\n background-color: rgba(241, 242, 243, 0.8);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-img-container\n .vicp-img-shade.vicp-img-shade-1 {\n top: 0;\n left: 0;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-img-container\n .vicp-img-shade.vicp-img-shade-2 {\n bottom: 0;\n right: 0;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-rotate {\n position: relative;\n width: 240px;\n height: 18px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-rotate\n i {\n display: block;\n width: 18px;\n height: 18px;\n border-radius: 100%;\n line-height: 18px;\n text-align: center;\n font-size: 12px;\n font-weight: bold;\n background-color: rgba(0, 0, 0, 0.08);\n color: #fff;\n overflow: hidden;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-rotate\n i:hover {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.14);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-rotate\n i:first-child {\n float: left;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-rotate\n i:last-child {\n float: right;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range {\n position: relative;\n margin: 30px 0 10px 0;\n width: 240px;\n height: 18px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon5,\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon6 {\n position: absolute;\n top: 0;\n width: 18px;\n height: 18px;\n border-radius: 100%;\n background-color: rgba(0, 0, 0, 0.08);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon5:hover,\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon6:hover {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n cursor: pointer;\n background-color: rgba(0, 0, 0, 0.14);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon5 {\n left: 0;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon5::before {\n position: absolute;\n content: \"\";\n display: block;\n left: 3px;\n top: 8px;\n width: 12px;\n height: 2px;\n background-color: #fff;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon6 {\n right: 0;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon6::before {\n position: absolute;\n content: \"\";\n display: block;\n left: 3px;\n top: 8px;\n width: 12px;\n height: 2px;\n background-color: #fff;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n .vicp-icon6::after {\n position: absolute;\n content: \"\";\n display: block;\n top: 3px;\n left: 8px;\n width: 2px;\n height: 12px;\n background-color: #fff;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"] {\n display: block;\n padding-top: 5px;\n margin: 0 auto;\n width: 180px;\n height: 8px;\n vertical-align: top;\n background: transparent;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: pointer;\n /* 滑块\n ---------------------------------------------------------------*/\n /* 轨道\n ---------------------------------------------------------------*/\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:focus {\n outline: none;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-webkit-slider-thumb {\n -webkit-box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n -webkit-appearance: none;\n appearance: none;\n margin-top: -3px;\n width: 12px;\n height: 12px;\n background-color: #61c091;\n border-radius: 100%;\n border: none;\n -webkit-transition: 0.2s;\n transition: 0.2s;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-moz-range-thumb {\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n -moz-appearance: none;\n appearance: none;\n width: 12px;\n height: 12px;\n background-color: #61c091;\n border-radius: 100%;\n border: none;\n -webkit-transition: 0.2s;\n transition: 0.2s;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-ms-thumb {\n box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.18);\n appearance: none;\n width: 12px;\n height: 12px;\n background-color: #61c091;\n border: none;\n border-radius: 100%;\n -webkit-transition: 0.2s;\n transition: 0.2s;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:active::-moz-range-thumb {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n width: 14px;\n height: 14px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:active::-ms-thumb {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n width: 14px;\n height: 14px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:active::-webkit-slider-thumb {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.23);\n margin-top: -4px;\n width: 14px;\n height: 14px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-webkit-slider-runnable-track {\n -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n width: 100%;\n height: 6px;\n cursor: pointer;\n border-radius: 2px;\n border: none;\n background-color: rgba(68, 170, 119, 0.3);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-moz-range-track {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n width: 100%;\n height: 6px;\n cursor: pointer;\n border-radius: 2px;\n border: none;\n background-color: rgba(68, 170, 119, 0.3);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-ms-track {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12);\n width: 100%;\n cursor: pointer;\n background: transparent;\n border-color: transparent;\n color: transparent;\n height: 6px;\n border-radius: 2px;\n border: none;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-ms-fill-lower {\n background-color: rgba(68, 170, 119, 0.3);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]::-ms-fill-upper {\n background-color: rgba(68, 170, 119, 0.15);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:focus::-webkit-slider-runnable-track {\n background-color: rgba(68, 170, 119, 0.5);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:focus::-moz-range-track {\n background-color: rgba(68, 170, 119, 0.5);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:focus::-ms-fill-lower {\n background-color: rgba(68, 170, 119, 0.45);\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-left\n .vicp-range\n input[type=\"range\"]:focus::-ms-fill-upper {\n background-color: rgba(68, 170, 119, 0.25);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step2 .vicp-crop .vicp-crop-right {\n float: right;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview {\n height: 150px;\n overflow: hidden;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview\n .vicp-preview-item {\n position: relative;\n padding: 5px;\n width: 100px;\n height: 100px;\n float: left;\n margin-right: 16px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview\n .vicp-preview-item\n span {\n position: absolute;\n bottom: -30px;\n width: 100%;\n font-size: 14px;\n color: #bbb;\n display: block;\n text-align: center;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview\n .vicp-preview-item\n img {\n position: absolute;\n display: block;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n margin: auto;\n padding: 3px;\n background-color: #fff;\n border: 1px solid rgba(0, 0, 0, 0.15);\n overflow: hidden;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview\n .vicp-preview-item.vicp-preview-item-circle {\n margin-right: 0;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step2\n .vicp-crop\n .vicp-crop-right\n .vicp-preview\n .vicp-preview-item.vicp-preview-item-circle\n img {\n border-radius: 100%;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step3 .vicp-upload {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 35px;\n height: 170px;\n background-color: rgba(0, 0, 0, 0.03);\n text-align: center;\n border: 1px dashed #ddd;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step3 .vicp-upload .vicp-loading {\n display: block;\n padding: 15px;\n font-size: 16px;\n color: #999;\n line-height: 30px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step3 .vicp-upload .vicp-progress-wrap {\n margin-top: 12px;\n background-color: rgba(0, 0, 0, 0.08);\n border-radius: 3px;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step3\n .vicp-upload\n .vicp-progress-wrap\n .vicp-progress {\n position: relative;\n display: block;\n height: 5px;\n border-radius: 3px;\n background-color: #4a7;\n -webkit-box-shadow: 0 2px 6px 0 rgba(68, 170, 119, 0.3);\n box-shadow: 0 2px 6px 0 rgba(68, 170, 119, 0.3);\n -webkit-transition: width 0.15s linear;\n transition: width 0.15s linear;\n background-image: -webkit-linear-gradient(\n 135deg,\n rgba(255, 255, 255, 0.2) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.2) 50%,\n rgba(255, 255, 255, 0.2) 75%,\n transparent 75%,\n transparent\n );\n background-image: linear-gradient(\n -45deg,\n rgba(255, 255, 255, 0.2) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.2) 50%,\n rgba(255, 255, 255, 0.2) 75%,\n transparent 75%,\n transparent\n );\n background-size: 40px 40px;\n -webkit-animation: vicp_progress 0.5s linear infinite;\n animation: vicp_progress 0.5s linear infinite;\n}\n.vue-image-crop-upload\n .vicp-wrap\n .vicp-step3\n .vicp-upload\n .vicp-progress-wrap\n .vicp-progress::after {\n content: \"\";\n position: absolute;\n display: block;\n top: -3px;\n right: -3px;\n width: 9px;\n height: 9px;\n border: 1px solid rgba(245, 246, 247, 0.7);\n -webkit-box-shadow: 0 1px 4px 0 rgba(68, 170, 119, 0.7);\n box-shadow: 0 1px 4px 0 rgba(68, 170, 119, 0.7);\n border-radius: 100%;\n background-color: #4a7;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-step3 .vicp-upload .vicp-error,\n.vue-image-crop-upload .vicp-wrap .vicp-step3 .vicp-upload .vicp-success {\n height: 100px;\n line-height: 100px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-operate {\n position: absolute;\n right: 20px;\n bottom: 20px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-operate a {\n position: relative;\n float: left;\n display: block;\n margin-left: 10px;\n width: 100px;\n height: 36px;\n line-height: 36px;\n text-align: center;\n cursor: pointer;\n font-size: 14px;\n color: #4a7;\n border-radius: 2px;\n overflow: hidden;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-operate a:hover {\n background-color: rgba(0, 0, 0, 0.03);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-error,\n.vue-image-crop-upload .vicp-wrap .vicp-success {\n display: block;\n font-size: 14px;\n line-height: 24px;\n height: 24px;\n color: #d10;\n text-align: center;\n vertical-align: top;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-success {\n color: #4a7;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-icon3 {\n position: relative;\n display: inline-block;\n width: 20px;\n height: 20px;\n top: 4px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-icon3::after {\n position: absolute;\n top: 3px;\n left: 6px;\n width: 6px;\n height: 10px;\n border-width: 0 2px 2px 0;\n border-color: #4a7;\n border-style: solid;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n content: \"\";\n}\n.vue-image-crop-upload .vicp-wrap .vicp-icon2 {\n position: relative;\n display: inline-block;\n width: 20px;\n height: 20px;\n top: 4px;\n}\n.vue-image-crop-upload .vicp-wrap .vicp-icon2::after,\n.vue-image-crop-upload .vicp-wrap .vicp-icon2::before {\n content: \"\";\n position: absolute;\n top: 9px;\n left: 4px;\n width: 13px;\n height: 2px;\n background-color: #d10;\n -webkit-transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n transform: rotate(45deg);\n}\n.vue-image-crop-upload .vicp-wrap .vicp-icon2::after {\n -webkit-transform: rotate(-45deg);\n -ms-transform: rotate(-45deg);\n transform: rotate(-45deg);\n}\n.e-ripple {\n position: absolute;\n border-radius: 100%;\n background-color: rgba(0, 0, 0, 0.15);\n background-clip: padding-box;\n pointer-events: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n -webkit-transform: scale(0);\n -ms-transform: scale(0);\n transform: scale(0);\n opacity: 1;\n}\n.e-ripple.z-active {\n opacity: 0;\n -webkit-transform: scale(2);\n -ms-transform: scale(2);\n transform: scale(2);\n -webkit-transition: opacity 1.2s ease-out, -webkit-transform 0.6s ease-out;\n transition: opacity 1.2s ease-out, -webkit-transform 0.6s ease-out;\n transition: opacity 1.2s ease-out, transform 0.6s ease-out;\n transition: opacity 1.2s ease-out, transform 0.6s ease-out,\n -webkit-transform 0.6s ease-out;\n}\n</style>\n"]}]}
|
