作者 dl

客服功能 首页轮播问题

正在显示 57 个修改的文件 包含 4105 行增加587 行删除

要显示太多修改。

为保证性能只显示 57 of 57+ 个文件。

... ... @@ -330,7 +330,7 @@ td, th {
.weui-toast {
position: fixed;
z-index: 5000;
width: 30%;
width: 40%;
min-width: 20%;
min-height: auto;
height: auto;
... ...
... ... @@ -45,7 +45,7 @@
left: 0;
padding: 0 0 0 0.41rem;
font-size: 13px;
z-index: 99;
z-index: 0;
}
.doc_left {
... ... @@ -83,10 +83,10 @@
font-size: 18px;
}
.pack {
margin: 0.11rem 0;
border: 0;
}
/*.pack {*/
/*margin: 0.11rem 0;*/
/*border: 0;*/
/*}*/
.doc_item {
display: flex;
... ...
... ... @@ -192,7 +192,7 @@ footer {
.banner_item_left {
padding: 0.22rem 0 0.22rem 0.22rem;
/*max-width: 1.6rem;*/
font-size: 10px;
font-size: 12px;
color: #8E8E8E;
display: flex;
flex-direction: column;
... ... @@ -231,6 +231,12 @@ footer {
.swiper_box {
background-color: #fff;
padding: 0 0.14rem;
z-index: 0;
overflow: hidden;
}
.swiper-container {
overflow: hidden;
}
.swiper_title {
... ... @@ -267,26 +273,32 @@ footer {
}
.swiper_item {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
color: #424242;
padding: 0.28rem 0.25rem 0.28rem 0;
margin: 0 0.14rem;
/*display: flex;*/
/*align-items: center;*/
/*justify-content: space-between;*/
/*font-size: 14px;*/
/*color: #424242;*/
/*padding: 14px 12px 14px 0;*/
/*margin: 0 7px;*/
border-top: 1px solid #ececec;
background-color: #fff;
box-sizing: border-box;
/*background-color: #fff;*/
/*width: 100%;*/
}
.swiper_item_img {
width: 1.86rem;
height: 1.6rem;
height: 1.60rem;
display: flex;
align-items: center;
justify-content: center;
margin-right: 0.22rem;
overflow: hidden;
border-radius: 0.1rem;
float: left;
padding: 0.28rem 0 0 0 ;
}
.swiper_item_img img {
... ... @@ -321,6 +333,7 @@ footer {
display: flex;
justify-content: space-between;
flex-direction: column;
margin: 0.28rem 0.25rem 0.28rem 0;
}
.swiper_item_type1, .swiper_item_type2, .swiper_item_type3 {
... ...
.my_top {
background-color: #ddbb72;
background: url("../../assets/image/center.png") no-repeat;
background-size: 100% 100%;
background-position: center;
height: 4.15rem;
overflow: hidden;
}
.my_top_icon_box {
... ... @@ -23,12 +25,13 @@
height: 1.8rem;
width: 1.8rem;
border-radius: 50%;
margin: 0 auto;
margin: 0.35rem auto;
border: 0.02rem solid #e6ac56;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.my_header_box {
... ... @@ -151,7 +154,7 @@
text-align: center;
color: #fff;
line-height: 0.4rem;
z-index: 10;
z-index: 0;
border-radius: 50%;
}
... ...
/**
* Swiper 3.4.2
* Swiper 4.3.5
* Most modern mobile touch slider and framework with hardware accelerated transitions
*
* http://www.idangero.us/swiper/
*
* Copyright 2017, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: March 10, 2017
*
* Copyright 2014-2018 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: July 31, 2018
*/
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
float: left
}
.swiper-container-vertical > .swiper-wrapper {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box
}
.swiper-container-android .swiper-slide, .swiper-wrapper {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.swiper-container-multirow > .swiper-wrapper {
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap
}
.swiper-container-free-mode > .swiper-wrapper {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
margin: 0 auto
}
.swiper-slide {
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative
}
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
height: auto
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-transition-property: -webkit-transform, height;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform, height
}
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000
}
.swiper-wp8-horizontal {
-ms-touch-action: pan-y;
touch-action: pan-y
}
.swiper-wp8-vertical {
-ms-touch-action: pan-x;
touch-action: pan-x
}
.swiper-button-next, .swiper-button-prev {
position: absolute;
top: 50%;
width: 27px;
height: 44px;
margin-top: -22px;
z-index: 10;
cursor: pointer;
-moz-background-size: 27px 44px;
-webkit-background-size: 27px 44px;
background-size: 27px 44px;
background-position: center;
background-repeat: no-repeat
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
opacity: .35;
cursor: auto;
pointer-events: none
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
left: 10px;
right: auto
}
.swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}
.swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
right: 10px;
left: auto
}
.swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")
}
.swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")
}
.swiper-pagination {
position: absolute;
text-align: center;
-webkit-transition: .3s;
-moz-transition: .3s;
-o-transition: .3s;
transition: .3s;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 10
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0
}
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
bottom: 10px;
left: 0;
width: 100%
}
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: .2
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-moz-appearance: none;
-ms-appearance: none;
-webkit-appearance: none;
appearance: none
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer
}
.swiper-pagination-white .swiper-pagination-bullet {
background: #fff
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #007aff
}
.swiper-pagination-white .swiper-pagination-bullet-active {
background: #fff
}
.swiper-pagination-black .swiper-pagination-bullet-active {
background: #000
}
.swiper-container-vertical > .swiper-pagination-bullets {
right: 10px;
top: 50%;
-webkit-transform: translate3d(0, -50%, 0);
-moz-transform: translate3d(0, -50%, 0);
-o-transform: translate(0, -50%);
-ms-transform: translate3d(0, -50%, 0);
transform: translate3d(0, -50%, 0)
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 5px 0;
display: block
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 5px
}
.swiper-pagination-progress {
background: rgba(0, 0, 0, .25);
position: absolute
}
.swiper-pagination-progress .swiper-pagination-progressbar {
background: #007aff;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: left top;
-moz-transform-origin: left top;
-ms-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top
}
.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
-webkit-transform-origin: right top;
-moz-transform-origin: right top;
-ms-transform-origin: right top;
-o-transform-origin: right top;
transform-origin: right top
}
.swiper-container-horizontal > .swiper-pagination-progress {
width: 100%;
height: 4px;
left: 0;
top: 0
}
.swiper-container-vertical > .swiper-pagination-progress {
width: 4px;
height: 100%;
left: 0;
top: 0
}
.swiper-pagination-progress.swiper-pagination-white {
background: rgba(255, 255, 255, .5)
}
.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
background: #fff
}
.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
background: #000
}
.swiper-container-3d {
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-o-perspective: 1200px;
perspective: 1200px
}
.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d
}
.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper {
-ms-perspective: 1200px
}
.swiper-container-cube, .swiper-container-flip {
overflow: visible
}
.swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1
}
.swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden
}
.swiper-container-cube .swiper-slide {
visibility: hidden;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
width: 100%;
height: 100%
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
-webkit-transform-origin: 100% 0;
-moz-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0
}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
background: #000;
opacity: .6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-zoom-container {
width: 100%;
height: 100%;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-moz-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-moz-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
text-align: center
}
.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
max-width: 100%;
max-height: 100%;
object-fit: contain
}
.swiper-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, .1)
}
.swiper-container-horizontal > .swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%
}
.swiper-container-vertical > .swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, .5);
border-radius: 10px;
left: 0;
top: 0
}
.swiper-scrollbar-cursor-drag {
cursor: move
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
-webkit-transform-origin: 50%;
-moz-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
-moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
animation: swiper-preloader-spin 1s steps(12, end) infinite
}
.swiper-lazy-preloader:after {
display: block;
content: "";
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-position: 50%;
-webkit-background-size: 100%;
background-size: 100%;
background-repeat: no-repeat
}
.swiper-lazy-preloader-white:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")
}
@-webkit-keyframes swiper-preloader-spin {
100% {
-webkit-transform: rotate(360deg)
}
}
@keyframes swiper-preloader-spin {
100% {
transform: rotate(360deg)
}
}
\ No newline at end of file
.swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.swiper-invisible-blank-slide{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s right,.2s -webkit-transform;transition:.2s right,.2s -webkit-transform;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right;transition:.2s transform,.2s right,.2s -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}
\ No newline at end of file
... ...
此 diff 太大无法显示。
!function(a){function b(){var b=a.document,c=b.documentElement,d=c.getBoundingClientRect().width;document.documentElement.style.fontSize=100*(d/750)+"px"}window.addEventListener("DOMContentLoaded",function(){b()},!1),window.addEventListener("resize",function(){b()}),b()}(window);
\ No newline at end of file
!function (a) {
function b() {
var b = a.document, c = b.documentElement, d = c.getBoundingClientRect().width;
document.documentElement.style.fontSize = 100 * (d / 750) + "px"
}
window.addEventListener("DOMContentLoaded", function () {
b()
}, !1), window.addEventListener("resize", function () {
b()
}), b()
}(window);
\ No newline at end of file
... ...
var baseurl = 'http://kindapp.w.bronet.cn/api/';//测试地址
var imgurl='http://kindapp.w.bronet.cn/'
// var baseurl = 'http://192.168.1.3/api/';//本地测试
var mobileReg = /^1(3[0-9]|4[57]|5[0-35-9]|7[0135678]|8[0-9])\d{8}$/; //手机正则
var id_card = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;//身份证正则
... ...
... ... @@ -4,4 +4,4 @@
* MIT license
*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.weui=t():e.weui=t()}(this,function(){return function(e){function t(i){if(n[i])return n[i].exports;var o=n[i]={exports:{},id:i,loaded:!1};return e[i].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(1),a=i(o),r=n(7),u=i(r),l=n(8),s=i(l),d=n(9),f=i(d),c=n(11),p=i(c),h=n(13),v=i(h),m=n(15),y=i(m),w=n(17),g=i(w),_=n(18),b=i(_),k=n(19),x=i(k),C=n(20),M=i(C),j=n(24),E=n(30),S=i(E),O=n(32),P=i(O);t.default={dialog:a.default,alert:u.default,confirm:s.default,toast:f.default,loading:p.default,actionSheet:v.default,topTips:y.default,searchBar:g.default,tab:b.default,form:x.default,uploader:M.default,picker:j.picker,datePicker:j.datePicker,gallery:S.default,slider:P.default},e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){function e(t){e=r.default.noop,u.addClass("weui-animate-fade-out"),a.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){o.remove(),s=!1,t&&t()})}function t(t){e(t)}var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(s)return s;var i=r.default.os.android;n=r.default.extend({title:null,content:"",className:"",buttons:[{label:"确定",type:"primary",onClick:r.default.noop}],isAndroid:i},n);var o=(0,r.default)(r.default.render(l.default,n)),a=o.find(".weui-dialog"),u=o.find(".weui-mask");return(0,r.default)("body").append(o),u.addClass("weui-animate-fade-in"),a.addClass("weui-animate-fade-in"),o.on("click",".weui-dialog__btn",function(e){var i=(0,r.default)(this).index();n.buttons[i].onClick?n.buttons[i].onClick.call(this,e)!==!1&&t():t()}),s=o[0],s.hide=t,s}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(6),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=this.os={},n=e.match(/(Android);?[\s\/]+([\d.]+)?/);n&&(t.android=!0,t.version=n[2])}Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};n(3);var r=n(4),u=i(r),l=n(5),s=i(l);o.call(s.default,navigator.userAgent),(0,u.default)(s.default.fn,{append:function(e){return e instanceof HTMLElement||(e=e[0]),this.forEach(function(t){t.appendChild(e)}),this},remove:function(){return this.forEach(function(e){e.parentNode.removeChild(e)}),this},find:function(e){return(0,s.default)(e,this)},addClass:function(e){return this.forEach(function(t){t.classList.add(e)}),this},removeClass:function(e){return this.forEach(function(t){t.classList.remove(e)}),this},eq:function(e){return(0,s.default)(this[e])},show:function(){return this.forEach(function(e){e.style.display="block"}),this},hide:function(){return this.forEach(function(e){e.style.display="none"}),this},html:function(e){return this.forEach(function(t){t.innerHTML=e}),this},css:function(e){var t=this;return Object.keys(e).forEach(function(n){t.forEach(function(t){t.style[n]=e[n]})}),this},on:function(e,t,n){var i="string"==typeof t&&"function"==typeof n;return i||(n=t),this.forEach(function(o){e.split(" ").forEach(function(e){o.addEventListener(e,function(e){i?this.contains(e.target.closest(t))&&n.call(e.target,e):n.call(this,e)})})}),this},off:function(e,t,n){return"function"==typeof t&&(n=t,t=null),this.forEach(function(i){e.split(" ").forEach(function(e){"string"==typeof t?i.querySelectorAll(t).forEach(function(t){t.removeEventListener(e,n)}):i.removeEventListener(e,n)})}),this},index:function(){var e=this[0],t=e.parentNode;return Array.prototype.indexOf.call(t.children,e)},offAll:function(){var e=this;return this.forEach(function(t,n){var i=t.cloneNode(!0);t.parentNode.replaceChild(i,t),e[n]=i}),this},val:function(){var e=arguments;return arguments.length?(this.forEach(function(t){t.value=e[0]}),this):this[0].value},attr:function(){var e=arguments,t=this;if("object"==a(arguments[0])){var n=function(){var n=e[0],i=t;return Object.keys(n).forEach(function(e){i.forEach(function(t){t.setAttribute(e,n[e])})}),{v:t}}();if("object"===("undefined"==typeof n?"undefined":a(n)))return n.v}return"string"==typeof arguments[0]&&arguments.length<2?this[0].getAttribute(arguments[0]):(this.forEach(function(t){t.setAttribute(e[0],e[1])}),this)}}),(0,u.default)(s.default,{extend:u.default,noop:function(){},render:function(e,t){var n="var p=[];with(this){p.push('"+e.replace(/[\r\t\n]/g," ").split("<%").join("\t").replace(/((^|%>)[^\t]*)'/g,"$1\r").replace(/\t=(.*?)%>/g,"',$1,'").split("\t").join("');").split("%>").join("p.push('").split("\r").join("\\'")+"');}return p.join('');";return new Function(n).apply(t)},getStyle:function(e,t){var n,i=(e.ownerDocument||document).defaultView;return i&&i.getComputedStyle?(t=t.replace(/([A-Z])/g,"-$1").toLowerCase(),i.getComputedStyle(e,null).getPropertyValue(t)):e.currentStyle?(t=t.replace(/\-(\w)/g,function(e,t){return t.toUpperCase()}),n=e.currentStyle[t],/^\d+(em|pt|%|ex)?$/i.test(n)?function(t){var n=e.style.left,i=e.runtimeStyle.left;return e.runtimeStyle.left=e.currentStyle.left,e.style.left=t||0,t=e.style.pixelLeft+"px",e.style.left=n,e.runtimeStyle.left=i,t}(n):n):void 0}}),t.default=s.default,e.exports=t.default},function(e,t){!function(e){"function"!=typeof e.matches&&(e.matches=e.msMatchesSelector||e.mozMatchesSelector||e.webkitMatchesSelector||function(e){for(var t=this,n=(t.document||t.ownerDocument).querySelectorAll(e),i=0;n[i]&&n[i]!==t;)++i;return Boolean(n[i])}),"function"!=typeof e.closest&&(e.closest=function(e){for(var t=this;t&&1===t.nodeType;){if(t.matches(e))return t;t=t.parentNode}return null})}(window.Element.prototype)},function(e,t){"use strict";function n(e){if(null===e||void 0===e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}function i(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;var i=Object.getOwnPropertyNames(t).map(function(e){return t[e]});if("0123456789"!==i.join(""))return!1;var o={};return"abcdefghijklmnopqrst".split("").forEach(function(e){o[e]=e}),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},o)).join("")}catch(e){return!1}}var o=Object.prototype.hasOwnProperty,a=Object.prototype.propertyIsEnumerable;e.exports=i()?Object.assign:function(e,t){for(var i,r,u=n(e),l=1;l<arguments.length;l++){i=Object(arguments[l]);for(var s in i)o.call(i,s)&&(u[s]=i[s]);if(Object.getOwnPropertySymbols){r=Object.getOwnPropertySymbols(i);for(var d=0;d<r.length;d++)a.call(i,r[d])&&(u[r[d]]=i[r[d]])}}return u}},function(e,t,n){var i,o;!function(n,a){a=function(e,t,n){function i(o,a,r){return r=Object.create(i.fn),o&&r.push.apply(r,o[t]?[o]:""+o===o?/</.test(o)?((a=e.createElement(a||t)).innerHTML=o,a.children):a?(a=i(a)[0])?a[n](o):r:e[n](o):"function"==typeof o?e.readyState[7]?o():e[t]("DOMContentLoaded",o):o),r}return i.fn=[],i.one=function(e,t){return i(e,t)[0]||null},i}(document,"addEventListener","querySelectorAll"),i=[],o=function(){return a}.apply(t,i),!(void 0!==o&&(e.exports=o))}(this)},function(e,t){e.exports='<div class="<%=className%>"> <div class=weui-mask></div> <div class="weui-dialog <% if(isAndroid){ %> weui-skin_android <% } %>"> <% if(title){ %> <div class=weui-dialog__hd><strong class=weui-dialog__title><%=title%></strong></div> <% } %> <div class=weui-dialog__bd><%=content%></div> <div class=weui-dialog__ft> <% for(var i = 0; i < buttons.length; i++){ %> <a href=javascript:; class="weui-dialog__btn weui-dialog__btn_<%=buttons[i][\'type\']%>"><%=buttons[i][\'label\']%></a> <% } %> </div> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:u.default.noop,n=arguments[2];return"object"===("undefined"==typeof t?"undefined":a(t))&&(n=t,t=u.default.noop),n=u.default.extend({content:e,buttons:[{label:"确定",type:"primary",onClick:t}]},n),(0,s.default)(n)}Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r=n(2),u=i(r),l=n(1),s=i(l);t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:u.default.noop,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:u.default.noop,i=arguments[3];return"object"===("undefined"==typeof t?"undefined":a(t))?(i=t,t=u.default.noop):"object"===("undefined"==typeof n?"undefined":a(n))&&(i=n,n=u.default.noop),i=u.default.extend({content:e,buttons:[{label:"取消",type:"default",onClick:n},{label:"确定",type:"primary",onClick:t}]},i),(0,s.default)(i)}Object.defineProperty(t,"__esModule",{value:!0});var a="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},r=n(2),u=i(r),l=n(1),s=i(l);t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(s)return s;"number"==typeof t&&(t={duration:t}),"function"==typeof t&&(t={callback:t}),t=r.default.extend({content:e,duration:3e3,callback:r.default.noop,className:""},t);var n=(0,r.default)(r.default.render(l.default,t)),i=n.find(".weui-toast"),o=n.find(".weui-mask");return(0,r.default)("body").append(n),i.addClass("weui-animate-fade-in"),o.addClass("weui-animate-fade-in"),setTimeout(function(){o.addClass("weui-animate-fade-out"),i.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){n.remove(),s=!1,t.callback()})},t.duration),s=n[0],n[0]}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(10),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="<%= className %>"> <div class=weui-mask_transparent></div><div class=weui-toast> <span class=weui-toast__content><%=content%></span> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){function e(t){e=r.default.noop,u.addClass("weui-animate-fade-out"),a.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){o.remove(),s=!1,t&&t()})}function t(t){e(t)}var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(s)return s;i=r.default.extend({content:n,className:""},i);var o=(0,r.default)(r.default.render(l.default,i)),a=o.find(".weui-toast"),u=o.find(".weui-mask");return(0,r.default)("body").append(o),a.addClass("weui-animate-fade-in"),u.addClass("weui-animate-fade-in"),s=o[0],s.hide=t,s}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(12),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="weui-loading_toast <%= className %>"> <div class=weui-mask_transparent></div> <div class=weui-toast> <i class="weui-loading weui-icon_toast"></i> <span class=weui-toast__content><%=content%></span> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(){function e(t){e=r.default.noop,d.addClass(o.isAndroid?"weui-animate-fade-out":"weui-animate-slide-down"),f.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){u.remove(),s=!1,o.onClose(),t&&t()})}function t(t){e(t)}var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(s)return s;var a=r.default.os.android;o=r.default.extend({menus:n,actions:i,className:"",isAndroid:a,onClose:r.default.noop},o);var u=(0,r.default)(r.default.render(l.default,o)),d=u.find(".weui-actionsheet"),f=u.find(".weui-mask");return(0,r.default)("body").append(u),r.default.getStyle(d[0],"transform"),d.addClass(o.isAndroid?"weui-animate-fade-in":"weui-animate-slide-up"),f.addClass("weui-animate-fade-in").on("click",function(){t()}),u.find(".weui-actionsheet__menu").on("click",".weui-actionsheet__cell",function(e){var i=(0,r.default)(this).index();n[i].onClick.call(this,e),t()}),u.find(".weui-actionsheet__action").on("click",".weui-actionsheet__cell",function(e){var n=(0,r.default)(this).index();i[n].onClick.call(this,e),t()}),s=u[0],s.hide=t,s}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(14),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="<% if(isAndroid){ %>weui-skin_android <% } %><%= className %>"> <div class=weui-mask></div> <div class=weui-actionsheet> <div class=weui-actionsheet__menu> <% for(var i = 0; i < menus.length; i++){ %> <div class=weui-actionsheet__cell><%= menus[i].label %></div> <% } %> </div> <div class=weui-actionsheet__action> <% for(var j = 0; j < actions.length; j++){ %> <div class=weui-actionsheet__cell><%= actions[j].label %></div> <% } %> </div> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){function t(e){t=r.default.noop,o.remove(),e&&e(),i.callback(),s=null}function n(e){t(e)}var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};"number"==typeof i&&(i={duration:i}),"function"==typeof i&&(i={callback:i}),i=r.default.extend({content:e,duration:3e3,callback:r.default.noop,className:""},i);var o=(0,r.default)(r.default.render(l.default,i));return(0,r.default)("body").append(o),s&&(clearTimeout(s.timeout),s.hide()),s={hide:n},s.timeout=setTimeout(n,i.duration),o[0].hide=n,o[0]}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(16),l=i(u),s=null;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="weui-toptips weui-toptips_warn <%= className %>" style=display:block><%= content %></div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=(0,r.default)(e);return t.forEach(function(e){function t(){o.val(""),n.removeClass("weui-search-bar_focusing")}var n=(0,r.default)(e),i=n.find(".weui-search-bar__label"),o=n.find(".weui-search-bar__input"),a=n.find(".weui-icon-clear"),u=n.find(".weui-search-bar__cancel-btn");i.on("click",function(){n.addClass("weui-search-bar_focusing"),o[0].focus()}),o.on("blur",function(){this.value.length||t()}),a.on("click",function(){o.val(""),o[0].focus()}),u.on("click",function(){t(),o[0].blur()})}),t}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a);t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=(0,r.default)(e);return t=r.default.extend({defaultIndex:0,onChange:r.default.noop},t),n.forEach(function(e){var n=(0,r.default)(e),i=n.find(".weui-navbar__item, .weui-tabbar__item"),o=n.find(".weui-tab__content");i.eq(t.defaultIndex).addClass("weui-bar__item_on"),o.eq(t.defaultIndex).show(),i.on("click",function(){var e=(0,r.default)(this),n=e.index();i.removeClass("weui-bar__item_on"),e.addClass("weui-bar__item_on"),o.hide(),o.eq(n).show(),t.onChange.call(this,n)})}),this}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a);t.default=o,e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){return e&&e.classList?e.classList.contains("weui-cell")?e:o(e.parentNode):null}function a(e,t,n){var i=e[0],o=e.val();if("INPUT"==i.tagName||"TEXTAREA"==i.tagName){var a=i.getAttribute("pattern")||"";if("radio"==i.type){for(var r=t.find('input[type="radio"][name="'+i.name+'"]'),u=0,l=r.length;u<l;++u)if(r[u].checked)return null;return"empty"}if("checkbox"!=i.type){if(a){if(/^REG_/.test(a)){if(!n)throw"RegExp "+a+" is empty.";if(a=a.replace(/^REG_/,""),!n[a])throw"RegExp "+a+" has not found.";a=n[a]}return new RegExp(a).test(o)?null:e.val().length?"notMatch":"empty"}return e.val().length?null:"empty"}if(!a)return i.checked?null:"empty";var s=function(){var e=t.find('input[type="checkbox"][name="'+i.name+'"]'),n=a.replace(/[{\s}]/g,"").split(","),o=0;if(2!=n.length)throw i.outerHTML+" regexp is wrong.";return e.forEach(function(e){e.checked&&++o}),""===n[1]?o>=parseInt(n[0])?{v:null}:{v:0==o?"empty":"notMatch"}:parseInt(n[0])<=o&&o<=parseInt(n[1])?{v:null}:{v:0==o?"empty":"notMatch"}}();if("object"===("undefined"==typeof s?"undefined":d(s)))return s.v}else if(o.length)return null;return"empty"}function r(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:c.default.noop,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=(0,c.default)(e);return i.forEach(function(e){var i=(0,c.default)(e),o=i.find("[required]");"function"!=typeof t&&(t=l);for(var r=0,u=o.length;r<u;++r){var s=o.eq(r),d=a(s,i,n.regexp),f={ele:s[0],msg:d};if(d)return void(t(f)||l(f))}t(null)}),this}function u(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=(0,c.default)(e);return n.forEach(function(e){var n=(0,c.default)(e);n.find("[required]").on("blur",function(){if("checkbox"!=this.type&&"radio"!=this.type){var e=(0,c.default)(this);if(!(e.val().length<1)){var i=a(e,n,t.regexp);i&&l({ele:e[0],msg:i})}}}).on("focus",function(){s(this)})}),this}function l(e){if(e){var t=(0,c.default)(e.ele),n=e.msg,i=t.attr(n+"Tips")||t.attr("tips")||t.attr("placeholder");if(i&&(0,h.default)(i),"checkbox"==e.ele.type||"radio"==e.ele.type)return;var a=o(e.ele);a&&a.classList.add("weui-cell_warn")}}function s(e){var t=o(e);t&&t.classList.remove("weui-cell_warn")}Object.defineProperty(t,"__esModule",{value:!0});var d="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},f=n(2),c=i(f),p=n(15),h=i(p);t.default={showErrorTips:l,hideErrorTips:s,validate:r,checkIfBlur:u},e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e,t){function n(e,t){var n=e.find('[data-id="'+t+'"]'),i=n.find(".weui-uploader__file-content");return i.length||(i=(0,r.default)('<div class="weui-uploader__file-content"></div>'),n.append(i)),n.addClass("weui-uploader__file_status"),i}function i(e,t){var n=e.find('[data-id="'+t+'"]').removeClass("weui-uploader__file_status");n.find(".weui-uploader__file-content").remove()}function o(e){e.url=u.createObjectURL(e),e.status="ready",e.upload=function(){(0,f.default)(r.default.extend({$uploader:a,file:e},t))},e.stop=function(){this.xhr.abort()},t.onQueued(e),t.auto&&e.upload()}var a=(0,r.default)(e),u=window.URL||window.webkitURL||window.mozURL;t=r.default.extend({url:"",auto:!0,type:"file",fileVal:"file",xhrFields:{},onBeforeQueued:r.default.noop,onQueued:r.default.noop,onBeforeSend:r.default.noop,onSuccess:r.default.noop,onProgress:r.default.noop,onError:r.default.noop},t),t.compress!==!1&&(t.compress=r.default.extend({width:1600,height:1600,quality:.8},t.compress)),t.onBeforeQueued&&!function(){var e=t.onBeforeQueued;t.onBeforeQueued=function(t,n){var i=e.call(t,n);if(i===!1)return!1;if(i!==!0){var o=(0,r.default)(r.default.render(l.default,{id:t.id}));a.find(".weui-uploader__files").append(o)}}}(),t.onQueued&&!function(){var e=t.onQueued;t.onQueued=function(n){if(!e.call(n)){var o=a.find('[data-id="'+n.id+'"]');o.css({backgroundImage:'url("'+(n.base64||n.url)+'")'}),t.auto||i(a,n.id)}}}(),t.onBeforeSend&&!function(){var e=t.onBeforeSend;t.onBeforeSend=function(t,n,i){var o=e.call(t,n,i);if(o===!1)return!1}}(),t.onSuccess&&!function(){var e=t.onSuccess;t.onSuccess=function(t,n){t.status="success",e.call(t,n)||i(a,t.id)}}(),t.onProgress&&!function(){var e=t.onProgress;t.onProgress=function(t,i){e.call(t,i)||n(a,t.id).html(i+"%")}}(),t.onError&&!function(){var e=t.onError;t.onError=function(t,i){t.status="fail",e.call(t,i)||n(a,t.id).html('<i class="weui-icon-warn"></i>')}}(),a.find('input[type="file"]').on("change",function(e){var n=e.target.files;0!==n.length&&(t.compress===!1&&"file"==t.type?Array.prototype.forEach.call(n,function(e){e.id=++c,t.onBeforeQueued(e,n)!==!1&&o(e)}):Array.prototype.forEach.call(n,function(e){e.id=++c,t.onBeforeQueued(e,n)!==!1&&(0,s.compress)(e,t,function(e){e&&o(e)})}),this.value="")})}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(21),l=i(u),s=n(22),d=n(23),f=i(d),c=0;t.default=o,e.exports=t.default},function(e,t){e.exports='<li class="weui-uploader__file weui-uploader__file_status" data-id="<%= id %>"> <div class=weui-uploader__file-content> <i class=weui-loading style=width:30px;height:30px></i> </div> </li> '},function(e,t){"use strict";function n(e){var t,n=e.naturalHeight,i=document.createElement("canvas");i.width=1,i.height=n;var o=i.getContext("2d");o.drawImage(e,0,0);try{t=o.getImageData(0,0,1,n).data}catch(e){return 1}for(var a=0,r=n,u=n;u>a;){var l=t[4*(u-1)+3];0===l?r=u:a=u,u=r+a>>1}var s=u/n;return 0===s?1:s}function i(e){for(var t=atob(e.split(",")[1]),n=new ArrayBuffer(t.length),i=new Uint8Array(n),o=0;o<t.length;o++)i[o]=t.charCodeAt(o);return n}function o(e){var t=e.split(",")[0].split(":")[1].split(";")[0],n=i(e);return new Blob([n],{type:t})}function a(e){var t=new DataView(e);if(65496!=t.getUint16(0,!1))return-2;for(var n=t.byteLength,i=2;i<n;){var o=t.getUint16(i,!1);if(i+=2,65505==o){if(1165519206!=t.getUint32(i+=2,!1))return-1;var a=18761==t.getUint16(i+=6,!1);i+=t.getUint32(i+4,a);var r=t.getUint16(i,a);i+=2;for(var u=0;u<r;u++)if(274==t.getUint16(i+12*u,a))return t.getUint16(i+12*u+8,a)}else{if(65280!=(65280&o))break;i+=t.getUint16(i,!1)}}return-1}function r(e,t,n){var i=e.width,o=e.height;switch(n>4&&(e.width=o,e.height=i),n){case 2:t.translate(i,0),t.scale(-1,1);break;case 3:t.translate(i,o),t.rotate(Math.PI);break;case 4:t.translate(0,o),t.scale(1,-1);break;case 5:t.rotate(.5*Math.PI),t.scale(1,-1);break;case 6:t.rotate(.5*Math.PI),t.translate(0,-o);break;case 7:t.rotate(.5*Math.PI),t.translate(i,-o),t.scale(-1,1);break;case 8:t.rotate(-.5*Math.PI),t.translate(-i,0)}}function u(e,t,u){var l=new FileReader;l.onload=function(l){if(t.compress===!1)return e.base64=l.target.result,void u(e);var s=new Image;s.onload=function(){var l=n(s),d=a(i(s.src)),f=document.createElement("canvas"),c=f.getContext("2d"),p=t.compress.width,h=t.compress.height,v=s.width,m=s.height,y=void 0;if(v<m&&m>h?(v=parseInt(h*s.width/s.height),m=h):v>=m&&v>p&&(m=parseInt(p*s.height/s.width),v=p),f.width=v,f.height=m,d>0&&r(f,c,d),c.drawImage(s,0,0,v,m/l),y=/image\/jpeg/.test(e.type)||/image\/jpg/.test(e.type)?f.toDataURL("image/jpeg",t.compress.quality):f.toDataURL(e.type),"file"==t.type)if(/;base64,null/.test(y)||/;base64,$/.test(y))u(e);else{var w=o(y);w.id=e.id,w.name=e.name,w.lastModified=e.lastModified,w.lastModifiedDate=e.lastModifiedDate,u(w)}else/;base64,null/.test(y)||/;base64,$/.test(y)?(t.onError(e,new Error("Compress fail, dataURL is "+y+".")),u()):(e.base64=y,u(e))},s.src=l.target.result},l.readAsDataURL(e)}Object.defineProperty(t,"__esModule",{value:!0}),t.default={compress:u},e.exports=t.default},function(e,t){"use strict";function n(e){var t=e.url,n=e.file,i=e.fileVal,o=e.onBeforeSend,a=e.onProgress,r=e.onError,u=e.onSuccess,l=e.xhrFields,s=n.name,d=n.type,f=n.lastModifiedDate,c={name:s,type:d,size:"file"==e.type?n.size:n.base64.length,lastModifiedDate:f},p={};if(o(n,c,p)!==!1){n.status="progress",a(n,0);var h=new FormData,v=new XMLHttpRequest;n.xhr=v,Object.keys(c).forEach(function(e){h.append(e,c[e])}),"file"==e.type?h.append(i,n,s):h.append(i,n.base64),v.onreadystatechange=function(){if(4==v.readyState)if(200==v.status)try{var e=JSON.parse(v.responseText);u(n,e)}catch(e){r(n,e)}else r(n,new Error("XMLHttpRequest response status is "+v.status))},v.upload.addEventListener("progress",function(e){if(0!=e.total){var t=100*Math.ceil(e.loaded/e.total);a(n,t)}},!1),v.open("POST",t),Object.keys(l).forEach(function(e){v[e]=l[e]}),Object.keys(p).forEach(function(e){v.setRequestHeader(e,p[e])}),v.send(h)}}Object.defineProperty(t,"__esModule",{value:!0}),t.default=n,e.exports=t.default},function(e,t,n){"use strict";function i(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t.default=e,t}function o(e){return e&&e.__esModule?e:{default:e}}function a(e){"object"!=("undefined"==typeof e?"undefined":l(e))&&(e={label:e,value:e}),d.default.extend(this,e)}function r(){function e(){(0,d.default)(r.container).append(v),d.default.getStyle(v[0],"transform"),v.find(".weui-mask").addClass("weui-animate-fade-in"),v.find(".weui-picker").addClass("weui-animate-slide-up")}function t(e){t=d.default.noop,v.find(".weui-mask").addClass("weui-animate-fade-out"),v.find(".weui-picker").addClass("weui-animate-slide-down").on("animationend webkitAnimationEnd",function(){v.remove(),g=!1,r.onClose(),e&&e()})}function n(e){t(e)}function i(e,t){if(void 0===p[t]&&r.defaultValue&&void 0!==r.defaultValue[t]){var n=r.defaultValue[t],o=0,u=e.length;if("object"==l(e[o]))for(;o<u&&n!=e[o].value;++o);else for(;o<u&&n!=e[o];++o);o<u&&(p[t]=o)}v.find(".weui-picker__group").eq(t).scroll({items:e,temp:p[t],onChange:function(e,n){if(e?c[t]=new a(e):c[t]=null,p[t]=n,s)c.length==y&&r.onChange(c);else if(e.children&&e.children.length>0)v.find(".weui-picker__group").eq(t+1).show(),!s&&i(e.children,t+1);else{var o=v.find(".weui-picker__group");o.forEach(function(e,n){n>t&&(0,d.default)(e).hide()}),c.splice(t+1),r.onChange(c)}},onConfirm:r.onConfirm})}if(g)return g;var o=arguments[arguments.length-1],r=d.default.extend({id:"default",className:"",container:"body",onChange:d.default.noop,onConfirm:d.default.noop,onClose:d.default.noop},o),u=void 0,s=!1;if(arguments.length>2){var f=0;for(u=[];f<arguments.length-1;)u.push(arguments[f++]);s=!0}else u=arguments[0];_[r.id]=_[r.id]||[];for(var c=[],p=_[r.id],v=(0,d.default)(d.default.render(m.default,r)),y=o.depth||(s?u.length:h.depthOf(u[0])),b="",k=y;k--;)b+=w.default;return v.find(".weui-picker__bd").html(b),e(),s?u.forEach(function(e,t){i(e,t)}):i(u,0),v.on("click",".weui-mask",function(){n()}).on("click",".weui-picker__action",function(){n()}).on("click","#weui-picker-confirm",function(){r.onConfirm(c)}),g=v[0],g.hide=n,g}function u(e){var t=d.default.extend({id:"datePicker",onChange:d.default.noop,onConfirm:d.default.noop,start:2e3,end:2030,cron:"* * *"},e);"number"==typeof t.start?t.start=new Date(t.start+"/01/01"):"string"==typeof t.start&&(t.start=new Date(t.start.replace(/-/g,"/"))),"number"==typeof t.end?t.end=new Date(t.end+"/12/31"):"string"==typeof t.end&&(t.end=new Date(t.end.replace(/-/g,"/")));var n=function(e,t,n){for(var i=0,o=e.length;i<o;i++){var a=e[i];if(a[t]==n)return a}},i=[],o=c.default.parse(t.cron,t.start,t.end),a=void 0;do{a=o.next();var u=a.value.getFullYear(),l=a.value.getMonth()+1,s=a.value.getDate(),f=n(i,"value",u);f||(f={label:u+"年",value:u,children:[]},i.push(f));var p=n(f.children,"value",l);p||(p={label:l+"月",value:l,children:[]},f.children.push(p)),p.children.push({label:s+"日",value:s})}while(!a.done);return r(i,t)}Object.defineProperty(t,"__esModule",{value:!0});var l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},s=n(2),d=o(s),f=n(25),c=o(f);n(26);var p=n(27),h=i(p),v=n(28),m=o(v),y=n(29),w=o(y);a.prototype.toString=function(){return this.value},a.prototype.valueOf=function(){return this.value};var g=void 0,_={};t.default={picker:r,datePicker:u},e.exports=t.default},function(e,t){"use strict";function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){var n=t[0],i=t[1],o=[],a=void 0;e=e.replace(/\*/g,n+"-"+i);for(var u=e.split(","),l=0,s=u.length;l<s;l++){var d=u[l];d.match(r)&&d.replace(r,function(e,t,r,u){u=parseInt(u)||1,t=Math.min(Math.max(n,~~Math.abs(t)),i),r=r?Math.min(i,~~Math.abs(r)):t,a=t;do o.push(a),a+=u;while(a<=r)})}return o}function o(e,t,n){var o=e.replace(/^\s\s*|\s\s*$/g,"").split(/\s+/),a=[];return o.forEach(function(e,t){var n=u[t];a.push(i(e,n))}),new l(a,t,n)}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}return function(t,n,i){return n&&e(t.prototype,n),i&&e(t,i),t}}(),r=/^(\d+)(?:-(\d+))?(?:\/(\d+))?$/g,u=[[1,31],[1,12],[0,6]],l=function(){function e(t,i,o){n(this,e),this._dates=t[0],this._months=t[1],this._days=t[2],this._start=i,this._end=o,this._pointer=i}return a(e,[{key:"_findNext",value:function(){for(var e=void 0;;){if(this._end.getTime()-this._pointer.getTime()<0)throw new Error("out of range, end is "+this._end+", current is "+this._pointer);var t=this._pointer.getMonth(),n=this._pointer.getDate(),i=this._pointer.getDay();if(this._months.indexOf(t+1)!==-1)if(this._dates.indexOf(n)!==-1){if(this._days.indexOf(i)!==-1){e=new Date(this._pointer);break}this._pointer.setDate(n+1)}else this._pointer.setDate(n+1);else this._pointer.setMonth(t+1),this._pointer.setDate(1)}return e}},{key:"next",value:function(){var e=this._findNext();return this._pointer.setDate(this._pointer.getDate()+1),{value:e,done:!this.hasNext()}}},{key:"hasNext",value:function(){try{return this._findNext(),!0}catch(e){return!1}}}]),e}();t.default={parse:o},e.exports=t.default},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}var o="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},a=n(2),r=i(a),u=function(e,t){return e.css({"-webkit-transition":"all "+t+"s",transition:"all "+t+"s"})},l=function(e,t){return e.css({"-webkit-transform":"translate3d(0, "+t+"px, 0)",transform:"translate3d(0, "+t+"px, 0)"})},s=function(e){for(var t=Math.floor(e.length/2),n=0;e[t]&&e[t].disabled;)if(t=++t%e.length,n++,n>e.length)throw new Error("No selectable item.");return t},d=function(e,t,n){var i=s(n);return(e-i)*t},f=function(e,t){return e*t},c=function(e,t,n){return-(t*(n-e-1))};r.default.fn.scroll=function(e){function t(e){y=e,g=+new Date}function n(e){w=e;var t=w-y;u(m,0),l(m,_+t),g=+new Date,b.push({time:g,y:w}),b.length>40&&b.shift()}function i(e){if(y){var t=(new Date).getTime(),n=k-p.bodyHeight/2;if(w=e,t-g>100)M(Math.abs(w-y)>10?w-y:n-w);else if(Math.abs(w-y)>10){for(var i=b.length-1,o=i,a=i;a>0&&g-b[a].time<100;a--)o=a;if(o!==i){var r=b[i],u=b[o],l=r.time-u.time,s=r.y-u.y,d=s/l,f=150*d+(w-y);M(f)}else M(0)}else M(n-w);y=null}}var a=this,p=r.default.extend({items:[],scrollable:".weui-picker__content",offset:3,rowHeight:34,onChange:r.default.noop,temp:null,bodyHeight:238},e),h=p.items.map(function(e){return'<div class="weui-picker__item'+(e.disabled?" weui-picker__item_disabled":"")+'">'+("object"==("undefined"==typeof e?"undefined":o(e))?e.label:e)+"</div>"}).join(""),v=(0,r.default)(this);v.find(".weui-picker__content").html(h);var m=v.find(p.scrollable),y=void 0,w=void 0,g=void 0,_=void 0,b=[],k=window.innerHeight;
if(null!==p.temp&&p.temp<p.items.length){var x=p.temp;p.onChange.call(this,p.items[x],x),_=(p.offset-x)*p.rowHeight}else{var C=s(p.items);p.onChange.call(this,p.items[C],C),_=d(p.offset,p.rowHeight,p.items)}l(m,_);var M=function(e){_+=e,_=Math.round(_/p.rowHeight)*p.rowHeight;var t=f(p.offset,p.rowHeight),n=c(p.offset,p.rowHeight,p.items.length);_>t&&(_=t),_<n&&(_=n);for(var i=p.offset-_/p.rowHeight;p.items[i]&&p.items[i].disabled;)e>0?++i:--i;_=(p.offset-i)*p.rowHeight,u(m,.3),l(m,_),p.onChange.call(a,p.items[i],i)};m=v.offAll().on("touchstart",function(e){t(e.changedTouches[0].pageY)}).on("touchmove",function(e){n(e.changedTouches[0].pageY),e.preventDefault()}).on("touchend",function(e){i(e.changedTouches[0].pageY)}).find(p.scrollable);var j="ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch;j||v.on("mousedown",function(e){t(e.pageY),e.stopPropagation(),e.preventDefault()}).on("mousemove",function(e){y&&(n(e.pageY),e.stopPropagation(),e.preventDefault())}).on("mouseup mouseleave",function(e){i(e.pageY),e.stopPropagation(),e.preventDefault()})}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.depthOf=function e(t){var n=1;return t.children&&t.children[0]&&(n=e(t.children[0])+1),n}},function(e,t){e.exports='<div class="<%= className %>"> <div class=weui-mask></div> <div class=weui-picker> <div class=weui-picker__hd> <a href=javascript:; data-action=cancel class=weui-picker__action>取消</a> <a href=javascript:; data-action=select class=weui-picker__action id=weui-picker-confirm>确定</a> </div> <div class=weui-picker__bd></div> </div> </div> '},function(e,t){e.exports="<div class=weui-picker__group> <div class=weui-picker__mask></div> <div class=weui-picker__indicator></div> <div class=weui-picker__content></div> </div>"},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){function t(e){t=r.default.noop,o.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){o.remove(),s=!1,e&&e()})}function n(e){t(e)}var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(s)return s;i=r.default.extend({className:"",onDelete:r.default.noop},i);var o=(0,r.default)(r.default.render(l.default,r.default.extend({url:e},i)));return(0,r.default)("body").append(o),o.find(".weui-gallery__img").on("click",function(){n()}),o.find(".weui-gallery__del").on("click",function(){i.onDelete.call(this,e)}),o.show().addClass("weui-animate-fade-in"),s=o[0],s.hide=n,s}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(31),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="weui-gallery <%= className %>"> <span class=weui-gallery__img style="background-image:url(<%= url %>)"></span> <div class=weui-gallery__opr> <a href=javascript: class=weui-gallery__del> <i class="weui-icon-delete weui-icon_gallery-delete"></i> </a> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=(0,r.default)(e);if(t=r.default.extend({step:void 0,defaultValue:0,onChange:r.default.noop},t),void 0!==t.step&&(t.step=parseFloat(t.step),!t.step||t.step<0))throw new Error("Slider step must be a positive number.");if(void 0!==t.defaultValue&&t.defaultValue<0||t.defaultValue>100)throw new Error("Slider defaultValue must be >= 0 and <= 100.");return n.forEach(function(e){function n(){var e=r.default.getStyle(l[0],"left");return e=/%/.test(e)?s*parseFloat(e)/100:parseFloat(e)}function i(n){var i=void 0,o=void 0;t.step&&(n=Math.round(n/p)*p),i=f+n,i=i<0?0:i>s?s:i,o=100*i/s,u.css({width:o+"%"}),l.css({left:o+"%"}),t.onChange.call(e,o)}var o=(0,r.default)(e),a=o.find(".weui-slider__inner"),u=o.find(".weui-slider__track"),l=o.find(".weui-slider__handler"),s=parseInt(r.default.getStyle(a[0],"width")),d=a[0].offsetLeft,f=0,c=0,p=void 0;t.step&&(p=s*t.step/100),t.defaultValue&&i(s*t.defaultValue/100),o.on("click",function(e){e.preventDefault(),f=n(),i(e.pageX-d-f)}),l.on("touchstart",function(e){f=n(),c=e.changedTouches[0].clientX}).on("touchmove",function(e){e.preventDefault(),i(e.changedTouches[0].clientX-c)})}),this}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a);t.default=o,e.exports=t.default}])});
\ No newline at end of file
if(null!==p.temp&&p.temp<p.items.length){var x=p.temp;p.onChange.call(this,p.items[x],x),_=(p.offset-x)*p.rowHeight}else{var C=s(p.items);p.onChange.call(this,p.items[C],C),_=d(p.offset,p.rowHeight,p.items)}l(m,_);var M=function(e){_+=e,_=Math.round(_/p.rowHeight)*p.rowHeight;var t=f(p.offset,p.rowHeight),n=c(p.offset,p.rowHeight,p.items.length);_>t&&(_=t),_<n&&(_=n);for(var i=p.offset-_/p.rowHeight;p.items[i]&&p.items[i].disabled;)e>0?++i:--i;_=(p.offset-i)*p.rowHeight,u(m,.3),l(m,_),p.onChange.call(a,p.items[i],i)};m=v.offAll().on("touchstart",function(e){t(e.changedTouches[0].pageY)}).on("touchmove",function(e){n(e.changedTouches[0].pageY),e.preventDefault()}).on("touchend",function(e){i(e.changedTouches[0].pageY)}).find(p.scrollable);var j="ontouchstart"in window||window.DocumentTouch&&document instanceof window.DocumentTouch;j||v.on("mousedown",function(e){t(e.pageY),e.stopPropagation(),e.preventDefault()}).on("mousemove",function(e){y&&(n(e.pageY),e.stopPropagation(),e.preventDefault())}).on("mouseup mouseleave",function(e){i(e.pageY),e.stopPropagation(),e.preventDefault()})}},function(e,t){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.depthOf=function e(t){var n=1;return t.children&&t.children[0]&&(n=e(t.children[0])+1),n}},function(e,t){e.exports='<div class="<%= className %>"> <div class=weui-mask></div> <div class=weui-picker> <div class=weui-picker__hd> <a href=javascript:; data-action=cancel class=weui-picker__action>取消</a> <a href=javascript:; data-action=select class=weui-picker__action id=weui-picker-confirm>确定</a> </div> <div class=weui-picker__bd></div> </div> </div> '},function(e,t){e.exports="<div class=weui-picker__group> <div class=weui-picker__mask></div> <div class=weui-picker__indicator></div> <div class=weui-picker__content></div> </div>"},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){function t(e){t=r.default.noop,o.addClass("weui-animate-fade-out").on("animationend webkitAnimationEnd",function(){o.remove(),s=!1,e&&e()})}function n(e){t(e)}var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(s)return s;i=r.default.extend({className:"",onDelete:r.default.noop},i);var o=(0,r.default)(r.default.render(l.default,r.default.extend({url:e},i)));return(0,r.default)("body").append(o),o.find(".weui-gallery__img").on("click",function(){n()}),o.find(".weui-gallery__del").on("click",function(){i.onDelete.call(this,e)}),o.show().addClass("weui-animate-fade-in"),s=o[0],s.hide=n,s}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a),u=n(31),l=i(u),s=void 0;t.default=o,e.exports=t.default},function(e,t){e.exports='<div class="weui-gallery <%= className %>"> <span class=weui-gallery__img style="background-image:url(<%= url %>)"></span> <div class=weui-gallery__opr> <a href=javascript: class=weui-gallery__del> <i class="weui-icon-delete weui-icon_gallery-delete"></i> </a> </div> </div> '},function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}function o(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=(0,r.default)(e);if(t=r.default.extend({step:void 0,defaultValue:0,onChange:r.default.noop},t),void 0!==t.step&&(t.step=parseFloat(t.step),!t.step||t.step<0))throw new Error("Slider step must be a positive number.");if(void 0!==t.defaultValue&&t.defaultValue<0||t.defaultValue>100)throw new Error("Slider defaultValue must be >= 0 and <= 100.");return n.forEach(function(e){function n(){var e=r.default.getStyle(l[0],"left");return e=/%/.test(e)?s*parseFloat(e)/100:parseFloat(e)}function i(n){var i=void 0,o=void 0;t.step&&(n=Math.round(n/p)*p),i=f+n,i=i<0?0:i>s?s:i,o=100*i/s,u.css({width:o+"%"}),l.css({left:o+"%"}),t.onChange.call(e,o)}var o=(0,r.default)(e),a=o.find(".weui-slider__inner"),u=o.find(".weui-slider__track"),l=o.find(".weui-slider__handler"),s=parseInt(r.default.getStyle(a[0],"width")),d=a[0].offsetLeft,f=0,c=0,p=void 0;t.step&&(p=s*t.step/100),t.defaultValue&&i(s*t.defaultValue/100),o.on("click",function(e){e.preventDefault(),f=n(),i(e.pageX-d-f)}),l.on("touchstart",function(e){f=n(),c=e.changedTouches[0].clientX}).on("touchmove",function(e){e.preventDefault(),i(e.changedTouches[0].clientX-c)})}),this}Object.defineProperty(t,"__esModule",{value:!0});var a=n(2),r=i(a);t.default=o,e.exports=t.default}])});
\ No newline at end of file
... ...
node_modules
temp
... ...
'use strict';
var glob = require('glob');
var fs = require('fs');
module.exports = function(grunt) {
grunt.initConfig({
concat: {
dist: {
src: [
'utils.js',
'upload.js',
'template.js',
'emoji.js',
'cs.js'
],
dest: 'temp/cs.js'
}
},
uglify: {
dist: {
src: [
'temp/cs.js',
'temp/template.js'
],
dest: 'dist/cs.min.js'
}
},
cssmin: {
dist: {
src: 'cs.css',
dest: 'dist/cs.min.css'
}
},
clean: {
dist: {
src: 'temp'
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask('html-to-js',function () {
var template = {};
glob.sync('./templates/**/*.html').forEach(filePath => {
var content = fs.readFileSync(filePath, {
encoding: 'utf8'
});
var key = filePath.replace(/^\.\//, '');
template[key] = content;
});
var dest = './temp/template.js';
var outputContent = 'RCS.templateCache=' + JSON.stringify(template, null, 4) + ';';
fs.writeFileSync(dest, outputContent);
});
grunt.registerTask('dist', ['concat', 'html-to-js', 'uglify', 'cssmin', 'clean']);
}
\ No newline at end of file
... ...
# 使用说明
1. 在页面引入以下资源
```
<!-- Web SDK 相关资源 SDK 针对自建客服做出了一些修改 -->
<script src="../RongIMLib-cs.js"></script>
<script src="./RongIMEmoji.js"></script>
<script src="//cdn.ronghub.com/RongIMVoice-2.2.4.min.js"></script>
<!-- 客服插件样式表和 js 代码 -->
<link rel="stylesheet" href="cs.css">
<script src="utils.js"></script>
<script src="upload.js"></script>
<script src="template.js"></script>
<script src="emoji.js"></script>
<script src="cs.js"></script>
```
2. 初始化客服插件
``` javascript
RCS.init({
appKey: "c9kqb3rdkh4jj",// 应用 appkey
token: "qjxXwJizd7Y62DTmUEluw5lzpNwuJBCkPrRErVG12EKi1UP6giNGqszv6IQX0IndGKwjoGwevVmUVSN0x458KOqK0LwxTuhy",// 当前游客或登录用户 token
upload: {
fileServer: "http://upload.qiniu.com",// 文件服务器地址
isPrivate: false // 是否是私有云
},
target: document.getElementById("rcs-app"),// 要插入到的页面节点
customerServiceId: "KEFU150535341165880",// 客服 Id
userIcon: 'http://7xo1cb.com1.z0.glb.clouddn.com/rongcloudkefu2.png',//用户默认头像,在用户没有头像的时候显示
csIcon: 'http://fsprodrcx.cn.ronghub.com/UQRxDVEHcD6_gHENUQRxDUs9XOZRBH25PGECfjBjFA/base64.png',//客服默认头像,在客服没有头像的时候显示,建议线上地址
showButton: true,
//是否需要按钮主动发起,设为false的时候,init()方法直接唤起聊天窗口,需客户自己编写按钮,点击之后调用init(),templates中的button模板不可用;设为true的时候,init()首先唤起客服咨询按钮,点击之后才连接客服,唤起聊天窗口,在进入页面之后就需调用init()方法。此参数是为了方便客户在点击客服按钮后自行获取token,在获取到token之后,执行init()即可。
connectingCallback: function(){
console.log('连接中');
},//连接中的执行的方法,例如显示加载页面,可不传
connectedCallback: function(){},//连接成功之后的方法,例如关闭加载页面,可不传
disconnectedCallback: function(){
alert('连接断开');
}//断开连接之后的操作,可不传
});
```
3.RC:InfoNtf消息里带有user对象,在接通客服坐席后,会收到一条RC:InfoNtf消息,可以进行保存客服信息(头像、名称等)
# 开发说明
## 目录结构说明
- dist
发布-合并压缩后的代码
+ cs.html
示例页面
- templates
HTML模板
- cs.css
样式表
- cs.html
开发测试页面
- cs.js
客服核心代码
- emoji.js
表情库调用封装
- upload.js
上传插件
- utils.js
工具类
## 合并压缩发布代码
```
安装依赖包
npm install
合并压缩代码
grunt dist
```
\ No newline at end of file
... ...
此 diff 太大无法显示。
.rongcloud-container *,.rongcloud-container *:before,.rongcloud-container *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
margin: 0;
padding: 0;
border: 0
}
.rongcloud-container * {
padding: 0;
margin: 0;
font-size: 14px;
font-weight: 400;
}
.rongcloud-container a {
text-decoration: none;
outline: 0;
}
.rongcloud-container img {
border: none;
vertical-align: middle;
}
.rongcloud-container textarea {
overflow: auto
}
.rongcloud-clearfix {
*zoom:1}
.rongcloud-clearfix:after {
display: table;
line-height: 0;
content: "";
clear: both
}
.rongcloud-pull-left{
float: left!important;
}
.rongcloud-pull-right{
float: right!important;
}
.rongcloud-sprite{
background: url("//cdn.ronghub.com/customerservice-icon.png") 0 0/50px auto no-repeat;
display: inline-block;
z-index: 1;
}
/*.rongcloud-sprite-kefu{
background: url("images/kefuicon.png") 0 0/50px auto no-repeat;
background-size: 20px 20px;
margin-right: 4px;
}*/
.rongcloud-blueBg{
background: url(//cdn.ronghub.com/customerservice-web-bg.png) 0 0/10px auto repeat;
}
/*.rongcloud-kefuListBox{
width: 194px;
height: 470px;
position: fixed;
right: 520px;
bottom: 100px;
z-index: 999;
box-shadow: 1px 1px #f9fafb;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 5px 2px;
border-radius: 5px;
}*/
#zhichiBtnBox .rongcloud-people{
background-position: 0 -411px;
width: 26px;
height: 32px;
}
#zhichiBtnBox .rongcloud-kefuBtn .rongcloud-arrow-up{
margin-left: 0;
}
.rongcloud-kefuListBox .rongcloud-kefuList{
/*border: 1px solid #cdd7db;*/
/*border-bottom: none;*/
/*border-radius: 5px 5px 0px 0px;*/
overflow: hidden;
/*height: 100%;*/
box-sizing: border-box;
position: absolute;
border-radius: 4px;
width: 194px;
height: 470px;
position: fixed;
right: 520px;
bottom: 100px;
z-index: 999;
box-shadow: 1px 1px #f9fafb;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 5px 2px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-rong-header{
height: 36px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-toolBar{
text-align: center;
padding-top: 8px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-people {
vertical-align: middle;
margin-right: 10px;
width: 20px;
border: none;
height: 20px;
background-size: 45px auto;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-arrow-down{
background-position: 0 -65px;
vertical-align: middle;
width: 24px;
border: none;
height: 24px;
margin-left: 10px;
margin-right: -5px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-recent{
color: #fff;
font-size: 14px;
margin: 0;
padding: 0;
cursor:default;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-count{
color: #d0d4d7;
font-size: 12px;
margin: 0;
padding: 0;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content{
position: absolute;
top:36px;
bottom: 0px;
left: 0px;
right: 0px;
overflow-x: hidden;
overflow-y: auto;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus{
height: 40px;
padding-left: 18px;
background-color: #ffafaf;
line-height: 40px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus.rongcloud-online{
background-color: #d3f8d6;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus .rongcloud-sprite{
width: 20px;
height: 22px;
vertical-align: middle;
background-position: 0 -139px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus.rongcloud-online .rongcloud-sprite{
background-position: 0 -100px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus span{
font-size: 14px;
color: #fff;
vertical-align: middle;
padding-left: 2px;
}
.rongcloud-kefuListBox .rongcloud-kefuList .rongcloud-content .rongcloud-netStatus.rongcloud-online span{
color: #868686;
}
.rongcloud-errorInfo{
position: absolute;
top: 35px;
left: 50%;
transform: translateX(-50%);
height: 30px;
line-height: 30px;
text-align: center;
width: 180px;
background-color: rgba(255,0,0,.8);
border-radius: 5px;
color: #fff;
z-index: 11111;
}
.rongcloud-kefuChat{
width:470px;
height:470px;
border-radius: 5px 5px 5px 5px;
box-shadow: rgba(0, 0, 0, 0.0980392) 0px 0px 5px 2px;
}
.rongcloud-kefuChat .rongcloud-rong-header{
height: 36px;
border-radius: 4px 4px 0px 0px;
position: relative;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-infoBar{
height: 36px;
line-height: 36px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-infoBarTit{
position: relative;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-Presence{
border-radius: 50%;
width: 8px;
height: 8px;
top: 14px;
left: 16px;
border: 0;
}
.rongcloud-kefuChat .rongcloud-rong-header.rongcloud-online .rongcloud-Presence{
background-color: #20e600;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-kefuName{
color: #fff;
padding-left: 16px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar{
margin-right: 10px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar a{
width: 20px;
height: 20px;
margin-top: 9px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar .rongcloud-kefuChatBoxHide{
background-position: 0 -460px;
cursor: pointer;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar .rongcloud-kefuChatBoxMin{
background-position: 0 -252px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar .rongcloud-kefuChatBoxMax{
background-position: 0 -213px;
}
.rongcloud-kefuChat .rongcloud-rong-header .rongcloud-toolBar .rongcloud-kefuChatBoxClose{
background-position: 0 -291px;
cursor: pointer;
}
.rcs-message-box {
width: 100%;
overflow: auto;
padding: 8px 16px;
position: absolute;
top:36px;
bottom: 114px;
background-color: white;
}
.rongcloud-box{
position: absolute;
top: 36px;
right: 0px;
left: 0px;
z-index: 10;
}
.rongcloud-kefuChat .rongcloud-outlineBox {
height: 40px;
padding-left: 18px;
background-color: #ffafaf;
line-height: 40px;
}
.rongcloud-kefuChat .rongcloud-outlineBox .rongcloud-sprite {
width: 20px;
height: 22px;
vertical-align: middle;
background-position: 0 -139px;
}
.rongcloud-kefuChat .rongcloud-outlineBox span {
font-size: 14px;
color: #fff;
vertical-align: middle;
padding-left: 2px;
}
.rongcloud-kefuChat .rongcloud-noticeBox {
height: 40px;
padding: 0px 18px;
background-color: #FFF5ED;
line-height: 40px;
}
.rongcloud-hasNotice{
top: 76px;
}
.rongcloud-kefuChat .rongcloud-link {
cursor: pointer;
}
.rongcloud-kefuChat .rongcloud-noticeBox .rongcloud-notice-horn {
display: inline-block;
width: 25px;
height: 22px;
vertical-align: middle;
background: url('images/Group 7.png');
background-repeat: no-repeat;
background-size: cover;
margin-right: 10px;
}
.rongcloud-kefuChat .rongcloud-noticeBox .rongcloud-notice-link{
float: right;
margin-top: 12px;
display: inline-block;
width: 9px;
height: 16px;
vertical-align: middle;
background: url('images/Combined Shape.png');
background-repeat: no-repeat;
background-size: cover;
}
.rongcloud-noticeBox-content{
font-size: 14px;
color: #9D5438;
vertical-align: middle;
padding-left: 2px;
display: inline-block;
width: 380px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.rongcloud-Messages-date {
text-align: center;
padding: 10px 20px;
/*border-bottom: 1px solid #e4e7ea;*/
margin-bottom: 30px;
height: 10px;
}
.rongcloud-Messages-date b {
font-size: 9pt;
font-weight: normal;
color: #8e969f;
background-color: #f9fbfd;
display: inline-block;
padding: 0 20px;
cursor:default;
}
.rongcloud-Messages-history {
text-align: center;
padding: 10px 20px;
/*border-bottom: 1px solid #e4e7ea;*/
margin-bottom: 30px;
height: 10px;
}
.rongcloud-Messages-history b {
font-size: 9pt;
font-weight: normal;
color: #8e969f;
background-color: #f9fbfd;
display: inline-block;
padding: 0 20px;
cursor:pointer;
}
.rongcloud-Messages-history b:hover{
color: #0099ff;
}
.rongcloud-Message-wrapper > div:last-child {
padding-bottom: 10px;
}
.rongcloud-Message {
position: relative;
padding-left: 3pc;
word-wrap: break-word;
word-break: break-all;
border-spacing: 1px;
margin-bottom: 20px;
}
.rongcloud-Message-send.rongcloud-Message{
padding-left: 0;
padding-right: 3pc;
}
.rongcloud-Message-header {
margin-top: 15px;;
}
.rongcloud-Message-send .rongcloud-Message-header{
display: table;
width: 100%;
}
.rongcloud-avatar {
width: 34px;
height: 34px;
border-radius: 50%;
}
.rongcloud-Message img {
max-width: 230px;
max-height: 250px;
}
.rongcloud-Message-avatar {
position: absolute;
margin-left: -3pc;
width: 34px;
height: 34px;
}
.rongcloud-Message-send .rongcloud-Message-avatar {
position: absolute;
right: 0;
}
.rongcloud-Message-author {
display: inline-block;
position: relative;
padding-right: 30px;
}
.rongcloud-Message-send .rongcloud-Message-author{
float: right;
padding-right: 0px;
}
.rongcloud-Message-author .rongcloud-author, .rongcloud-Message-author .rongcloud-time {
display: block;
float: left;
line-height: 1pc;
}
.rongcloud-Message-author > .rongcloud-author {
color: #8e969f;
text-decoration: none !important;
cursor: default;
}
.rongcloud-Message-author > .rongcloud-time {
color: #8e969f;
font-size: 9pt;
margin-left: 9pt;
}
.rongcloud-Message-body {
position: relative;
/*margin-right: 70px;*/
font-size: 14px;
line-height: 18px;
color: #444;
}
.rongcloud-Message-send .rongcloud-Message-body{
float: right;
}
.rongcloud-Message-text, .rongcloud-file-text {
position: relative;
display: inline-block;
max-width: 100%;
}
.rongcloud-Message-text pre {
font-size: 14px;
line-height: 18px;
color: rgb(68, 68, 68);;
word-break: break-all;
word-wrap: break-word;
white-space: pre-wrap;
background-color: transparent;
border: none;
border-radius: 0;
font-family: "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
}
.rongcloud-Message-entry {
display: inline-block;
max-width: 100%;
}
.rongcloud-Message-entry p {
margin-bottom: 5px;
}
.rongcloud-Message-entry a {
text-decoration: none;
}
.rongcloud-Message-img img {
border-radius: 5px;
}
/*音频消息*/
.rongcloud-Message-audio .rongcloud-Message-entry{
overflow:hidden;
}
.rongcloud-Message-audio .rongcloud-audioBox{
float: left;
}
.rongcloud-Message-audio .rongcloud-r-audioBox{
float: right;
}
.rongcloud-Message-audio .rongcloud-audioBox {
display: inline-block;
cursor: pointer;
background: url(//cdn.ronghub.com/customerservice-audio-bg.png) 0 0/170px auto no-repeat;
width: 165px;
height: 36px;
padding: 3px 0 3px 15px;
}
.rongcloud-Message-audio .rongcloud-audioBox i{
float: left;
display: inline-block;
width: 4px;
height: 26px;
opacity: 1;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.rongcloud-Message-audio .rongcloud-r-audioBox {
display: inline-block;
cursor: pointer;
background: url(./images/audioRBG.png) 0 0/165px auto no-repeat;
width: 165px;
height: 36px;
padding: 3px 15px 3px 0px;
}
.rongcloud-Message-audio .rongcloud-r-audioBox i{
float: right;
display: inline-block;
width: 4px;
height: 26px;
opacity: 1;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.rongcloud-Message-audio .rongcloud-audioBox i:nth-child(1){
background: url(//cdn.ronghub.com/customerservice-audio-bg.png) 0px -40px/170px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-audioBox i:nth-child(2){
background: url(//cdn.ronghub.com/customerservice-audio-bg.png) -7px -40px/170px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-audioBox i:nth-child(3){
background: url(//cdn.ronghub.com/customerservice-audio-bg.png) -14px -40px/170px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-audioBox.rongcloud-animate i:nth-child(2){
animation: audioAnimate 1s linear 0s infinite ;
/* Firefox: */
-moz-animation: audioAnimate 1s linear 0s infinite ;
/* Safari 和 Chrome: */
-webkit-animation: audioAnimate 1s linear 0s infinite ;
/* Opera: */
-o-animation: audioAnimate 1s linear 0s infinite ;
}
.rongcloud-Message-audio .rongcloud-audioBox.rongcloud-animate i:nth-child(3){
animation: audioAnimate 1s linear 0s infinite ;
/* Firefox: */
-moz-animation: audioAnimate 1s linear 0s infinite ;
/* Safari 和 Chrome: */
-webkit-animation: audioAnimate 1s linear 0s infinite ;
/* Opera: */
-o-animation: audioAnimate 1s linear 0s infinite ;
}
.rongcloud-Message-audio .rongcloud-r-audioBox i:nth-child(1){
background: url(./images/audioRBG.png) -161px -40px/165px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-r-audioBox i:nth-child(2){
background: url(./images/audioRBG.png) -154px -40px/165px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-r-audioBox i:nth-child(3){
background: url(./images/audioRBG.png) -147px -40px/165px auto no-repeat;
}
.rongcloud-Message-audio .rongcloud-r-audioBox.rongcloud-animate i:nth-child(2){
animation: audioAnimate 1s linear 0s infinite ;
/* Firefox: */
-moz-animation: audioAnimate 1s linear 0s infinite ;
/* Safari 和 Chrome: */
-webkit-animation: audioAnimate 1s linear 0s infinite ;
/* Opera: */
-o-animation: audioAnimate 1s linear 0s infinite ;
}
.rongcloud-Message-audio .rongcloud-r-audioBox.rongcloud-animate i:nth-child(3){
animation: audioAnimate 1s linear 0s infinite ;
/* Firefox: */
-moz-animation: audioAnimate 1s linear 0s infinite ;
/* Safari 和 Chrome: */
-webkit-animation: audioAnimate 1s linear 0s infinite ;
/* Opera: */
-o-animation: audioAnimate 1s linear 0s infinite ;
}
@keyframes audioAnimate
{
from {opacity: 0;}
to {opacity: 1;}
}
@-moz-keyframes audioAnimate /* Firefox */
{
from {opacity: 0;}
to {opacity: 1;}
}
@-webkit-keyframes audioAnimate /* Safari 和 Chrome */
{
from {opacity: 0;}
to {opacity: 1;}
}
@-o-keyframes audioAnimate /* Opera */
{
from {opacity: 0;}
to {opacity: 1;}
}
.rongcloud-Message-audio .rongcloud-audioTimer{
margin-top: 5px;
margin-left: 10px;
color: #8e969f;
}
.rongcloud-Message-audio .rongcloud-audioState{
width: 10px;
height: 10px;
display: inline-block;
background-color: #ff7373;
margin-top: 13px;
border-radius: 5px;
}
.rongcloud-sys-tips{
text-align: center;
padding: 10px 0;
margin-top: 10px;
}
.rongcloud-sys-tips>span{
padding:7px 10px;
background: #e7ecf2;
border-radius: 3px;
font-size: 12px;
color: #8e969f;
line-height: 32px;
}
.rongcloud-sys-tips a{
font-size: 12px;
}
.rongcloud-rong-footer {
background: #fff;
height: 114px;
position: absolute;
bottom: 0px;
left:0px;
right: 0px;
border-radius: 0px 0px 5px 5px;
/*border: 1px solid #cdd7db;
border-top: none;*/
}
.rongcloud-footer-con {
border-top: 1px solid #cdd7db;
}
.rongcloud-text-layout {
margin: 0 10px;
}
.rongcloud-funcPanel {
line-height: 22px;
height: 22px;
position: relative;
margin-top: 5px;
}
.rongcloud-funcPanel .rongcloud-mode1{
float: left;
}
.rongcloud-funcPanel .rongcloud-mode2{
float: right;
cursor: pointer;
}
.rongcloud-funcPanel .rongcloud-mode2 a{
color: #0099ff;
font-size: 12px;
}
.rongcloud-robotMode {
display: block;
}
.rongcloud-text {
width: 100%;
display: inline-block;
height: 80px;
padding: 5px;
border: 0;
color: #999;
color: black;
resize: none;
font-size: 9pt;
overflow: auto;
white-space: pre-wrap;
word-wrap: break-word;
}
.rongcloud-text:focus {
outline: 0;
}
.rongcloud-powBox {
position: absolute;
right: 0px;
/*width: 100%;*/
height: 24px;
}
.rongcloud-rong-send-btn {
position: absolute;
top:55px;
right: 10px;
bottom: 0;
margin: 0;
padding: 0;
cursor: pointer;
border: none;
width: 60px;
height: 24px;
line-height: 24px;
border-radius: 40px;
font-size: 9pt;
color: rgb(255, 255, 255);
background: #0099ff;
outline:0;
}
.rongcloud-MessageForm-tool {
position: relative;
margin-right: 8px;
float: left;
overflow: hidden;
}
.rongcloud-MessageForm-tool input[type="file"] {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
cursor: pointer;
opacity: 0;
}
.rongcloud-MessageForm-tool i {
width: 20px;
height: 20px;
line-height: 20px;
cursor: pointer;
display: inline-block;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-smile {
background-size: 45px;
background-position: 0 -297px;
}
.rongcloud-expressionWrap {
border: 1px solid #D9DADC;
width: 290px;
padding: 5px 8px;
position: absolute;
left: -2px;
top: -198px;
height: 180px;
background: #fff;
z-index: 1100;
overflow: auto;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
.rongcloud-expressionContent{
width: 100%;
}
.rongcloud-expressionContent div{
cursor: pointer;
margin: 0 2px;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-upload {
width: 24px;
background-size: 45px;
background-position: 0 -333px;
}
.rongcloud-expressionWrap .rongcloud-arrow {
position: absolute;
left: 5px;
bottom: -9px;
display: inline-block;
width: 10px;
height: 9px;
background: url(//cdn.ronghub.com/customerservice-icon.png);
background-position: 0 -1476px;
}
/* 客服评价 */
.rongcloud-layermbox {
/*position: relative;*/
position: initial;
height: 100%;
z-index: 19891014;
}
.rongcloud-layermmain {
display: table;
pointer-events: none;
}
.rongcloud-laymshade, .rongcloud-layermmain {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1200;
}
.rongcloud-laymshade {
background-color: rgba(0,0,0, .5);
pointer-events: auto;
}
.rongcloud-layermmain .rongcloud-section {
display: table-cell;
vertical-align: middle;
text-align: center;
}
.rongcloud-layermchild {
position: relative;
display: inline-block;
text-align: left;
background-color: #fff;
font-size: 14px;
border-radius: 3px;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
pointer-events: auto;
/*max-width: 250px;*/
}
.rongcloud-layermchild h3{
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.rongcloud-layermcont{
padding: 20px 20px 10px;
text-align: center;
}
.rongcloud-layermbox .rongcloud-rong-btn{
display: inline-block;
width: 54px;
height: 30px;
line-height: 30px;
border: 1px solid #c4c4c4;
border-radius: 3px;
color: #000;
overflow: hidden;
}
.rongcloud-layermbox .rongcloud-rong-btn:hover{
background-color: #0099ff;
color: #fff;
border-color: #0099ff;
}
.rongcloud-layermbox .rongcloud-feedback{
background-color: rgba(0,0,0,.6);
color: #fff;
border: none;
}
.rongcloud-layermbox .rongcloud-feedback .rongcloud-layermcont{
padding: 15px;
font-size: 16px;
}
.cursor-pointer{
cursor: pointer;
}
/* 图片预览 */
.rebox{
z-index: 999999;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 1000;
background: rgba(0, 0, 0, 0.7);
}
.rebox-contents{
position: absolute;
top: 5%;
left: 5%;
text-align: center;
width: 90%;
height: 90%;
}
.rebox-contents .rebox-content {
border: none!important;
box-shadow: 0 0 8px #222!important;
cursor: pointer;
border: 5px solid #fff;
background-color: #fff;
border-radius: 1px;
max-width: 100%;
max-height: 100%;
margin: auto;
position: absolute;
bottom: 0;
top: 0;
left: 0;
right: 0;
}
.rebox-close {
right: 10px;
top: 10px;
}
.rebox-button {
position: absolute;
z-index: 9999;
min-width: 40px;
height: 40px;
line-height: 40px;
background: rgb(0, 0, 0);
opacity: 0.4;
text-decoration: none;
font-size: 24px;
color: #fff;
text-align: center;
vertical-align: middle;
-webkit-border-radius: 32px;
-moz-border-radius: 32px;
-ms-border-radius: 32px;
border-radius: 32px;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
transition: all 0.3s;
}
.rebox-button:hover {
opacity: 1;
-webkit-transform: scale(1.4);
-moz-transform: scale(1.4);
-ms-transform: scale(1.4);
transform: scale(1.4);
}
/* 小能客服 */
.rongcloud-layer-title {
padding: 5px;
text-align: center;
}
.rongcloud-evaluate .rongcloud-layer-body label {
line-height: 2.3;
margin-right: 20px;
color: #808586;
}
.rongcloud-evaluate .rongcloud-layer-body input {
margin-right: 5px;
vertical-align: middle;
border: 1px solid #BBBBBB;
border-radius: 5px;
}
.rongcloud-suggest {
resize: none;
padding: 5px;
width: 100%;
height: 70px;
border: 1px solid #BBBBBB;
border-radius: 5px;
outline: none;
}
.rongcloud-suggest:focus{
border-color: #0099ff;
}
.rongcloud-layer-body .rongcloud-form-item label {
width: 52px;
display: inline-block;
vertical-align: top;
text-align: right;
white-space: nowrap;
}
.rongcloud-layer-body .rongcloud-form-item textarea,input[type=text] {
width: 200px;
}
.rongcloud-layer-body .rongcloud-form-item textarea {
padding: 5px;
max-width: 200px;
max-height: 160px;
resize:none;
}
.rongcloud-require:before {
content:"* ";
color:#f26868;
font-weight:bold;
}
.rongcloud-evaluate {
width: 266px;
padding-top: 10px;
}
.rongcloud-evaluate .rongcloud-layer-title{
font-size: 14px;
color: #333;
border-bottom: 1px solid #ddd;
}
.rongcloud-evaluate .rongcloud-layer-body{
padding: 0px 15px 5px;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
.rongcloud-group-title{
text-align: center;
line-height: 35px;
color: #333;
font-size: 14px;
}
.rongcloud-group-tag-list{
display: table;
width: 100%;
padding: 0px 5px;
}
.rongcloud-group-tag{
font-size: 12px;
text-align: center;
width: 105px;
float: left;
margin-right: 15px;
margin-bottom: 5px;
border: 1px solid #B4BDCB;
border-radius: 8px;
height: 25px;
line-height: 22px;
color: #B4BDCB;
cursor: pointer;
}
.rongcloud-group-tag:hover{
border: 1px solid #A1A6B7;
color: #A1A6B7;
}
.rongcloud-group-tag-active,.rongcloud-solve-active{
background-color: #1399FF;
border-color: #1399FF;
color: #fff;
}
.rongcloud-group-tag-active:hover,.rongcloud-solve-active:hover{
color: #fff;
border-color: #1399FF;
}
.rongcloud-group-tag-list .rongcloud-group-tag:nth-child(2n){
margin-right: 0px;
}
.rongcloud.group-title{
margin-bottom: 10px;
}
.rongcloud-leaveword {
width: 300px;
}
.rongcloud-foot {
text-align: center;
padding-bottom: 10px;
}
.rongcloud-layer-submit {
padding: 5px;
width: 100px;
border: 1px solid #BBBBBB;
border-radius: 5px;
background-color: white;
outline:none;
}
.rongcloud-layer-submit:hover {
background-color: #EEE;
}
.rongcloud-layer-close {
position: absolute;
font-size: 16px;
top: 5px;
right: 5px;
padding: 6px;
line-height: 16px;
cursor: pointer;
}
.rongcloud-Message-file {
position: relative;
width: 270px;
overflow: hidden;
border: 1px solid #b9c1ca;
border-radius: 3px;
}
.rongcloud-file-icon {
float: left;
width: 52px;
height: 52px;
margin: 8px;
display: inline-block;
border-radius: 5px;
background-size: 45px;
background-position: 3px -541px;
background-color: #3ea9ff;
}
.rongcloud-file-name {
width: 155px;
margin-top: 8px;
margin-bottom: 4px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.rongcloud-file-size {
font-size: 12px;
}
.rongcloud-file-download {
position: absolute;
right: 10px;
top: 15px;
display: inline-block;
width: 30px;
height: 30px;
background-size: 45px;
background-position: 0 -611px;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-file {
width: 24px;
height: 24px;
background-size: 45px;
background-position: 0 -443px;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-download {
width: 24px;
height: 24px;
background-size: 45px;
background-position: 0 -476px;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-evaluate {
width: 24px;
height: 24px;
background-size: 45px;
background-position: 0 -504px;
}
.rongcloud-MessageForm-tool i.rongcloud-iconfont-evaluate[disabled] {
background-position: -23px -504px;
cursor: default;
}
.rongcloud-endconversation {
width: 270px;
height: 135px;
padding: 22px;
}
.rongcloud-endconversation .rongcloud-prompt {
margin-top: 10px;
}
.rongcloud-endconversation .rongcloud-buttons {
margin-top: 30px;
text-align: center;
}
.rongcloud-buttons button+button {
margin-left: 50px;
}
.rongcloud-button {
width: 77px;
height: 30px;
line-height: 30px;
border: 1px solid #D8D8D8;
border-radius: 4px;
background-color: white;
outline:none;
}
.rongcloud-button:hover{
border-color: #53B4FF;
color:#53B4FF;
}
.rongcloud-leavemessage {
position: absolute;
top: 36px;
bottom: 0;
left: 0;
right: 0;
background-color: white;
}
.rongcloud-leavemessage-title {
padding: 20px 40px 25px;
width: 310px;
}
.rongcloud-form-item {
margin: 0 40px 25px;
font-size: 14px;
}
.rongcloud-form-item label {
display: inline-block;
margin-right: 10px;
}
.rongcloud-leavemessage .rongcloud-form-item label {
width: 70px;
text-align: right;
}
.rongcloud-form-error {
color: #f26868;
margin: 2px 0 -19px 85px;
font-size: 13px;
}
.rongcloud-form-item textarea {
vertical-align: top;
width: 270px;
height: 120px;
padding: 4px;
border: 1px solid #cccccc;
border-radius: 4px;
resize: none;
}
.rongcloud-form-item .rongcloud-inputtext{
width: 270px;
height: 26px;
box-shadow: rgba(0, 0, 0, 0.07451) 0px 1px 1px inset;
padding: 4px;
border: 1px solid #cccccc;
border-radius: 4px;
outline: none;
}
.rongcloud-form-item .rongcloud-form-label{
line-height: 26px;
}
.rongcloud-leavemessage-form-btns{
text-align: center;
}
.rongcloud-btn {
width: 150px;
height: 30px;
line-height: 30px;
color: white;
outline: none;
background-color: #0099FF;
border-radius: 4px;
cursor: pointer;
}
/*收集用户信息*/
.rongcloud-collectuserinfo-title{
padding: 30px 20px 15px
}
.rongcloud-collectuserinfo .rongcloud-form-item{
margin: 0 20px 25px;
}
.rongcloud-collectuserinfo .rongcloud-form-item .rongcloud-inputtext{
width: 200px;
}
.rongcloud-collectuserinfo .rongcloud-form-error{
margin: 2px 0 -19px 65px;
}
.rongcloud-consult {
position: fixed;
right: 50px;
bottom: 10px;
width: 195px;
text-align: center;
}
.rongcloud-consult button {
display: block;
width: 195px;
margin-bottom: 17px;
background: #0096f9;
border: 0;
padding: 0;
color: #fff;
font-family: 'Microsoft Yahei';
font-size: 16px;
cursor: pointer;
}
.rongcloud-consult button[disabled] {
background-color: #EEEEEE;
cursor: default;
}
.rongcloud-consult span {
display: inline-block;
padding-left: 43px;
line-height: 50px;
background: url(//cdn.ronghub.com/customerservice-icon.png) no-repeat 0 -358px;
background-size: 45px;
}
.rong-conversation{
font-size:12px;
line-height:20px;
color:#333;
min-height:40px;
padding:5px;
border-bottom:1px dotted #f5f5f5;
cursor:pointer;
}
.rong-conversation img {
width:40px;
height:40px;
position:absolute;
}
.rong-conversation-name,
.rong-conversation-message{
margin-left:45px;
}
.rong-conversation-name{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 140px;
display: inline-block;
}
.rcs-chat-wrapper{
position:fixed;
bottom: 100px;
right: 48px;
width: 470px;
height: 470px;
}
.leavemessageHref{
cursor: pointer;
color: #00A3FF;
}
.leavemessageHref:hover{
text-decoration: underline;
}
.rong-link-site, .rong-link-email{
color: #008af3;
}
.rong-link-site:hover ,.rong-link-email:hover{
text-decoration: underline;
}
.satisfaction-star{
display: inline-block;
width: 35px;
height: 30px;
margin-left: 7px;
background-image: url("./images/star.png");
background-repeat: no-repeat;
background-size: 30px;
cursor: pointer;
}
.satisfaction-star-selected{
background-position-y: -30px;
}
.rongcloud-evaluate-btn{
width: 50%;
height: 50px;
color: #0099ff;
text-align: center;
line-height: 50px;
background-color: #fff;
box-sizing: border-box;
cursor: pointer;
outline: none;
}
.rongcloud-evaluate-btn:active{
background-color: #ddd;
}
.rongcloud-evaluate-btn:nth-child(1){
border-right: 1px solid #c6c6c6;
border-bottom-left-radius: 3px;
}
.rongcloud-evaluate-btn:nth-child(2){
border-bottom-right-radius: 3px;
}
.rongcloud-evaluate .rongcloud-foot{
padding-bottom: 0px;
border-top: 1px solid #c6c6c6;
}
.rongcloud-footer-input{
height: 80px;
padding-right: 80px;
}
.rongcloud-footer-textarea{
height: 100%;
}
.rongcloud-phone-infoBar{
text-align: center;
line-height: 36px;
color: #fff;
}
.rongcloud-phone-exit{
display: inline-block;
position: absolute;
left: 5px;
top: 5px;
width: 26px;
height: 26px;
background-image: url("./images/back.png");
background-size: 25px;
background-repeat: no-repeat;
}
.rongcloud-phone-exit:active{
color: #c6c6c6;
}
.emojiItem{
display: inline-block;
}
@media screen and (max-width: 600px) {
.rcs-chat-wrapper{
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.rongcloud-kefuChat{
width: 100%;
height:100%;
}
.rongcloud-kefuChat .rongcloud-rong-header{
border-radius: 0px;
}
.rcs-message-box{
bottom: 65px;
}
.rongcloud-rong-footer{
height: 65px;
}
.rongcloud-footer-input{
height: 35px;
}
.rongcloud-rong-send-btn{
top: 35px;
}
.rongcloud-text{
height: 35px;
}
}
\ No newline at end of file
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>CS</title>
<link rel="stylesheet" href="cs.css?5">
<style>
.rongcloud-blueBg {
background: none;
background-color: #dbb25f;
}
</style>
</head>
<body>
<div id="rcs-app"></div>
<script src="./RongIMLib-cs.min.js"></script>
<script src="./RongIMEmoji.js"></script>
<script src="//cdn.ronghub.com/RongIMVoice-2.2.4.min.js"></script>
<script src="utils.js"></script>
<script src="upload.js"></script>
<script src="template.js"></script>
<script src="emoji.js"></script>
<script src="cs.js"></script>
<script type="text/javascript" src="../../assets/js/api.js"></script>
<script type="text/javascript" src="../../assets/js/public.js"></script>
<script type="text/javascript" src="../../assets/js/vue.min.js"></script>
<script type="text/javascript" src="../../assets/js/axios.min.js"></script>
<!-- 实例化 -->
<script>
apiready = function () {
var rongYunToken = api.pageParam.rongYunToken;
var userId = api.pageParam.userId;
alert(rongYunToken);
RCS.init({
appKey: "8w7jv4qb82s2y",
token: rongYunToken,
target: document.getElementById('rcs-app'),
customerServiceId: "KEFU150535341165880", // 客服Id
userIcon: 'http://7xo1cb.com1.z0.glb.clouddn.com/rongcloudkefu2.png',//用户默认头像,在用户没有头像的时候显示
csIcon: 'http://fsprodrcx.cn.ronghub.com/UQRxDVEHcD6_gHENUQRxDUs9XOZRBH25PGECfjBjFA/base64.png',//客服默认头像,在客服没有头像的时候显示,建议线上地址
showButton: false,
//是否需要按钮主动发起,设为false的时候,init()方法直接唤起聊天窗口,需客户自己编写按钮,点击之后调用init(),templates中的button模板不可用;设为true的时候,init()首先唤起客服咨询按钮,点击之后才连接客服,唤起聊天窗口,在进入页面之后就需调用init()方法。此参数是为了方便客户在点击客服按钮后自行获取token,在获取到token之后,执行init()即可。
connectingCallback: function () {
console.log('连接中');
},//连接中的执行的方法,例如显示加载页面,可不传
connectedCallback: function () {
},//连接成功之后的方法,例如关闭加载页面,可不传
disconnectedCallback: function () {
alert('连接断开');
},//断开连接之后的操作,可不传
templates: {
button: ['<div class="rongcloud-consult">',
' <button onclick="RCS.showCommon()"><span>客服咨询</span></button>',
'</div>',
'<div class="customer-service" style="display: none;"></div>'].join('')//"templates/button.html",
// chat: "templates/chat.html",
// closebefore: 'templates/closebefore.html',
// conversation: 'templates/conversation.html',
// endconversation: 'templates/endconversation.html',
// evaluate: 'templates/evaluate.html',
// imageView: 'templates/imageView.html',
// leaveword: 'templates/leaveword.html',
// main: 'templates/main.html',
// message: 'templates/message.html',
// messageTemplate: 'templates/messageTemplate.html',
// userInfo: 'templates/userInfo.html',
}
});
}
</script>
</body>
</html>
\ No newline at end of file
... ...
;(function(RCS){
var utils = RCS.utils;
var emoji = RCS.emoji;
var render = utils.render;
var conversation = {};
conversation.lastSendTime = 0;
conversation.lastInputTime = 0;
conversation.evaluateStatus = true;//判断评价的类型,用户关闭时出现的还是客服主动下发的
conversation.closeStatus = 1;
conversation.messageContent = [];
conversation.evaluateFormValue = {};
conversation.evaluateFormValue.isresolve = 1;
var voicePlay = null;
var userInfoValue = {};//保存收集用户信息的相关数据
var templates = {};
var $ = utils.$;
var terminal;
var supportNot = false;//页面是否支持notification
var sdkConnect = 0;
//加载模板
var getTemplates = function(callback){
templates = RCS.getTemplates();
callback && callback();
}
//键盘回车发送
var keySend = function(event){
if (event.keyCode == '13' && !event.shiftKey) {
event.preventDefault()
send();
} else if(conversation.needTypSts == 1){
inputChange();
}
}
//发送
var send = function(){
var inputMsg = $(".rongcloud-text")[0];
var message = inputMsg.value;
if (message) {
message = emoji.symbolToEmoji(message);
sendMessage(new RongIMLib.TextMessage({content:message,extra:"附加信息"}));
inputMsg.value = '';
inputMsg.focus();
}
}
//每6秒执行一次正在输入消息发送
var inputChange = function(){
var timespan = new Date().getTime() - conversation.lastSendTime;
if (timespan > 1000 * 6) {
conversation.lastSendTime += timespan;
sendTyping();
}
}
//正在输入中
var sendTyping = function(){
if (conversation.targetType == RongIMLib.ConversationType.CUSTOMER_SERVICE) {
var msg = new RongIMLib.TypingStatusMessage({
typingContentType:'RC:TxtMsg',
data:null
});
var callback = function(){};
sendMessage(msg,callback);
}
}
//显示表情
var showemoji = function(event){
event.stopPropagation();
var emojiContent = $('.rongcloud-expressionWrap')[0];
if (emojiContent.style.display == 'none') {
utils.show(emojiContent);
} else {
utils.hide(emojiContent);
}
}
//表情点击
var chooseEmoji = function(event){
event.stopPropagation();
var emojiContent = $('.rongcloud-expressionWrap')[0];
var thisTarget = event.target || event.srcElement;
var textArea = $('.rongcloud-text')[0];
if (thisTarget.className == 'RC_Expression') {
thisTarget = thisTarget.parentNode;
}
var emojiName = thisTarget.getAttribute('name');
if (emojiName) {
textArea.value += emojiName;
utils.hide(emojiContent);
if (terminal == 'pc') {
textArea.focus();
range = document.createRange();
range.selectNodeContents(textArea);
range.collapse(true);
range.setEnd(textArea, textArea.childNodes.length);
range.setStart(textArea, textArea.childNodes.length);
sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
}
}
}
function textMessageFormat(content) {
if(content.length === 0){
return '';
}
content = utils.encodeHtmlStr(content);
content = utils.replaceUri(content, function(uri, protocol) {
var link = uri;
if (!protocol) {
link = 'http://' + uri;
}
return '<a class="rong-link-site" target="_blank" href="'+ link +'">' + uri + '</a>';
});
content = utils.replaceEmail(content, function(email) {
return '<a class="rong-link-email" href="mailto:' + email + '">' + email + '<a>';
});
return emoji.emojiToHTML(content, 18);
}
//发送消息
var sendMessage = function(msg,callback){
var targetId = conversation.id; // 目标 Id
RongIMClient.getInstance().sendMessage(conversation.targetType, targetId, msg, {
// 发送消息成功
onSuccess: function (message) {
console.log(message);
//message 为发送的消息对象并且包含服务器返回的消息唯一Id和发送消息时间戳
console.log("Send successfully");
callback && callback();
if (!callback) {
updateMessage(message);
}
},
onError: function (errorCode,message) {
var info = '';
switch (errorCode) {
case RongIMLib.ErrorCode.TIMEOUT:
info = '超时';
break;
case RongIMLib.ErrorCode.UNKNOWN_ERROR:
info = '未知错误';
break;
case RongIMLib.ErrorCode.REJECTED_BY_BLACKLIST:
info = '在黑名单中,无法向对方发送消息';
break;
case RongIMLib.ErrorCode.NOT_IN_DISCUSSION:
info = '不在讨论组中';
break;
case RongIMLib.ErrorCode.NOT_IN_GROUP:
info = '不在群组中';
break;
case RongIMLib.ErrorCode.NOT_IN_CHATROOM:
info = '不在聊天室中';
break;
default :
info = x;
break;
}
console.log('发送失败:' + info);
}
});
}
//显示新消息
var updateMessage = function(message){
conversation.messageContent.push(message);
var newMessage = modifyMessage(utils.cloneObj(message));
if (message.messageDirection != 1 && supportNot) {
pushMessage(newMessage);
}
var messageList = $(".rcs-message-box")[0];
if (!messageList) {
return;
}
if (newMessage.sentTime - conversation.lastSendTime >= 60000) {//超过1分钟
var messageTime = {};
messageTime.content = {};
messageTime.messageType = 'TimeMessage';
messageTime.sentTime = utils.getTime(newMessage.sentTime);
messageList.innerHTML += render(templates.messageTemplate,messageTime);
conversation.lastSendTime = newMessage.sentTime;
}
messageList.innerHTML += render(templates.messageTemplate,newMessage);
messageList.scrollTop = messageList.scrollHeight;
}
//web push message
var pushMessage = function(msg){
if (terminal == 'pc') {
var title = '客服消息提醒';
var options = {
body: "您有一条新消息,请及时回复",
icon: (msg.content.user&&msg.content.user.icon) ? msg.content.user.icon : RCS.config.csIcon,
};
var notification = new Notification(title,options);
notification.onclick = function(event) {
window.focus();
notification.close();
}
notification.onshow = function() {
setTimeout(function() {
notification.close();
}, 5000);
};
}
}
//图片新消息图片加载完毕滚动到最下面
var scrollBottom = function(){
var messageList = $(".rcs-message-box")[0];
messageList.scrollTop = messageList.scrollHeight;
}
//加载历史消息
var loadHisMessages = function(){
var callbacks = function(list,hasMsg){
var messageBox = $(".rcs-message-box")[0];
var messageList = {};
messageList.hasMore = hasMsg;
messageList.list = modificateMessage(conversation.messageContent);
var oldHeight = messageBox.scrollHeight;
messageBox.innerHTML = render(templates.message,messageList);
var newHeight = messageBox.scrollHeight;
messageBox.scrollTop = newHeight-oldHeight;
}
getHisMessage(conversation.id,null,20,callbacks);
}
//生成会话列表界面
var createConversation = function(config){
var data = {
"showConversitionList": config.showConversitionList
}
if (data.showConversitionList) {
data.conversationList = render(templates.conversation,config.customers);
}
$(".customer-service")[0].innerHTML = render(templates.main,data);
var conversationList = $(".rong-conversation");
for(var i=0;i<conversationList.length;i++){
conversationList[i].onclick = function(){
if (conversation.id == this.getAttribute("_cid")) {
return;
}
conversation.id = this.getAttribute("_cid");
//初始化客服
startCustomerServer(conversation.id);
};
}
}
//进入指定会话
var openConversation = function(conversationId){
conversation.targetType = RongIMLib.ConversationType.CUSTOMER_SERVICE;
var chat = $(".rcs-chat-wrapper")[0];
var data = {};
var messageList = {};
messageList.firstEnter = true;
data.messageList = render(templates.message, messageList);
data.evaEntryPoint = conversation.evaEntryPoint;
data.terminal = terminal;
data.announce = conversation.announce;
$(".rcs-chat-wrapper")[0].innerHTML = render(templates.chat, data);
//初始化表情
var emojiList = emoji.getEmoji();
var strHtml = '';
for (var i = 0; i < emojiList.length; i++) {
strHtml += '<div class="emojiItem">'+emojiList[i].outerHTML+'</div>';
}
$('.rongcloud-expressionContent')[0].innerHTML += strHtml;
var callbacks = function(list,hasMsg){
if (hasMsg || list.length != 0) {
$('.rongcloud-Messages-history')[0].style.display = 'block';
}
}
getHisMessage(conversationId,0,2,callbacks);
}
//拉去消息记录
var getHisMessage = function(conversationId,timestrap,count,callbacks){
var conversationType = RongIMLib.ConversationType.CUSTOMER_SERVICE; //私聊,其他会话选择相应的消息类型即可。
var targetId = conversationId; // 想获取自己和谁的历史消息,targetId 赋值为对方的 Id。
// timestrap默认传 null,若从头开始获取历史消息,请赋值为 0 ,timestrap = 0;
// count每次获取的历史消息条数,范围 0-20 条,可以多次获取。
RongIMLib.RongIMClient.getInstance().getHistoryMessages(conversationType, targetId, timestrap, count, {
onSuccess: function(list, hasMsg) {
console.log(list);
conversation.messageContent = list.concat(conversation.messageContent);
callbacks(list,hasMsg);
},
onError: function(error) {
console.log("GetHistoryMessages,errorcode:" + error);
}
});
}
//单条消息修饰
var modifyMessage = function(msg){
if (msg.messageType == 'TextMessage') {
msg.content.content = textMessageFormat(msg.content.content);
} else if (msg.messageType == 'FileMessage') {
msg.content.size = utils.getFileSize(msg.content.size);
} else if (msg.messageType == 'InfoNtf') {
msg.messageType = 'InformationNotificationMessage';
} else if (msg.messageType == 'VoiceMessage'){
RongIMLib.RongIMVoice.preLoaded(msg.content.content);
} else if (msg.messageType == 'PullLeaveMessage'){
msg.messageType = 'AlertMessage';
msg.content.content = msg.content.content.replace('留言', '<a class="leavemessageHref" onclick="RCS.leavemessage()">留言</a>');
}
return msg;
}
//消息修饰
var modificateMessage = function(list){
var listTemp = JSON.parse(JSON.stringify(list));
var _list = [];
for (var i = 0; i < listTemp.length; i++) {
var messageTime = {
sentTime: utils.getTime(listTemp[i].sentTime),
messageType: 'TimeMessage'
};
var messageMap = [
"TextMessage",
"FileMessage",
"InfoNtf",
"ImageMessage",
"InformationNotificationMessage",
"VoiceMessage",
"PullLeaveMessage"
];
if (messageMap.indexOf(listTemp[i].messageType) >= 0) {
listTemp[i] = modifyMessage(listTemp[i]);
} else {
continue;
}
if (i == 0) {
_list.push(messageTime);
}else if (listTemp[i].sentTime - listTemp[i-1].sentTime >= 6000) {
_list.push(messageTime);
}
_list.push(listTemp[i]);
}
return _list;
}
//客服初始化
var startCustomerServer = function(targetId){
RongIMLib.RongIMClient.getInstance().startCustomService(targetId, {
onSuccess: function() {
console.log('客服初始化成功');
conversation.connect = true;
},
onError: function() {
}
},RCS.config.extraInfo);
}
//断开客服连接
var stopCustomerServer = function(callback){
console.log(conversation.id);
RongIMLib.RongIMClient.getInstance().stopCustomeService(conversation.id, {
onSuccess: function() {
conversation.connect = false;
console.log('客服断开成功');
callback && callback();
},
onError: function(errorcode) {
console.log('errorcode');
}
});
}
//改变键盘状态
var changeServiceState = function(status){
if (status == 'robot') {
conversation.serviceState = 'robot';
utils.hide($('.rongcloud-mode1')[0]);
utils.show($('.rongcloud-mode2')[0]);
} else {
conversation.serviceState = 'people';
utils.hide($('.rongcloud-mode2')[0]);
utils.show($('.rongcloud-mode1')[0]);
}
}
//转人工
var switchPerson = function(){
console.log(conversation.id);
RongIMLib.RongIMClient.getInstance().switchToHumanMode(conversation.id, {
onSuccess: function() {
console.log('转人工成功');
},
onError: function() {
}
});
}
//转人工的监听
var changeModeResponse = function(message){
conversation.evaluate = message.content.data.satisfaction;
var systemMsg = null;
switch (message.content.data.status){
case 1:
changeServiceState('people');
break;
case 2:
changeServiceState('robot');
break;
case 3:
systemMsg = '你被拉黑了';//用户被拉黑,灰条消息你被拉黑了
break;
case 4:
systemMsg = '已经是人工了';//用户已经转人工,灰条消息已经是人工了
break;
default:
break;
}
return systemMsg;
}
//发送欢迎语
var addCustomServiceInfo = function(msg){
var message = {};
message.sentTime = new Date().getTime();
message.content = {};
message.messageType = 'TextMessage';
message.content.content = msg.robotWelcome;
message.content.user = {};
message.content.user.icon = msg.robotIcon;
message.content.user.name = msg.robotName;
console.log(message);
updateMessage(message);
}
//发送灰条消息
var addServiceTip = function(content){
var message = {};
message.sentTime = new Date().getTime();
message.content = {};
message.messageType = 'InformationNotificationMessage';
message.content.message = content;
console.log(message);
updateMessage(message);
}
//播放音频
var play = function(event, msgContent){
RongIMLib.RongIMVoice.stop();
var thisTarget = event.target || event.srcElement;
if (thisTarget.className.indexOf('rongcloud-animate') != -1) {
thisTarget.className = thisTarget.className.replace(' rongcloud-animate','');
clearTimeout(voicePlay);
} else {
var audioStatusNode = thisTarget.parentNode.querySelector('.rongcloud-audioState');
if (audioStatusNode) {
audioStatusNode.parentNode.removeChild(audioStatusNode);
}
if (voicePlay) {
clearTimeout(voicePlay);
var voiceList = $('.rongcloud-audioBox');
for (var i = 0; i < voiceList.length; i++) {
voiceList[i].className = 'rongcloud-audioBox rongcloud-clearfix';
}
}
RongIMLib.RongIMVoice.play(msgContent.content, msgContent.duration);
thisTarget.className = thisTarget.className +' rongcloud-animate';
voicePlay = setTimeout(function(){
thisTarget.className = thisTarget.className.replace(' rongcloud-animate','');
},msgContent.duration * 1000);
}
}
//播放视频
var playVideo = function (event) {
var video = event.currentTarget.querySelector('video');
var btn = event.currentTarget.querySelector('.play-btn');
if (video.paused) {
video.play();
btn.style.display = "none";
} else {
video.pause();
btn.style.display = "block";
}
video.onended = function () {
btn.style.display = "block";
}
}
//播放视频
var playVideo = function (event) {
var video = event.currentTarget.querySelector('video');
var btn = event.currentTarget.querySelector('.play-btn');
if (video.paused) {
video.play();
btn.style.display = "none";
} else {
video.pause();
btn.style.display = "block";
}
video.onended = function () {
btn.style.display = "block";
}
}
//img上传图片
var imgUpload = function(event){
var thisTarget = event.target || event.srcElement;
var _file = thisTarget.files;
for (var i = 0; i < _file.length; i++) {
RCS.imageStartUpload(_file[i],function(data){
console.log("文件上传完成:", data);
getFileUrl(data);
});
}
thisTarget.value = '';
}
//上传文件
var fileUpload = function(event){
var thisTarget = event.target || event.srcElement;
var _file = thisTarget.files;
for (var i = 0; i < _file.length; i++) {
RCS.fileStartUpload(_file[i],function(data){
console.log("文件上传完成:", data);
getFileUrl(data);
});
}
thisTarget.value = '';
}
var urlItem = {
file: function(data){
if (RCS.config.upload && RCS.config.upload.isPrivate) {
if (data.rc_url.type == 1) {
data.downloadUrl = data.rc_url.path;
} else {
data.downloadUrl = RCS.config.upload.fileServer + data.rc_url.path;
}
var msg = messageItem[data.fileType](data);
sendMessage(msg);
} else {
var fileType = RongIMLib.FileType.FILE;
RongIMClient.getInstance().getFileUrl(fileType, data.filename, data.name, {
onSuccess: function(result){
data.downloadUrl = result.downloadUrl;
var msg = messageItem[data.fileType](data);
sendMessage(msg);
},
onError: function(error){
showResult('getFileToken error:' + error);
}
});
}
},
image: function(data){
if (RCS.config.upload && RCS.config.upload.isPrivate) {
if (data.rc_url.type == 1) {
data.downloadUrl = data.rc_url.path;
} else {
data.downloadUrl = RCS.config.upload.fileServer + data.rc_url.path;
}
var msg = messageItem[data.fileType](data);
sendMessage(msg);
} else {
var fileType = RongIMLib.FileType.IMAGE;
RongIMClient.getInstance().getFileUrl(fileType, data.filename, null, {
onSuccess: function(result){
data.downloadUrl = result.downloadUrl;
var msg = messageItem[data.fileType](data);
sendMessage(msg);
},
onError: function(error){
console.log(error);
}
});
}
}
};
var messageItem = {
file: function(file){
var name = file.name || '',
index = name.lastIndexOf('.') + 1,
type = name.substring(index);
// 发送文件消息请参考: http://rongcloud.cn/docs/web_api_demo.html#发送消息
// 创建文件消息
return new RongIMLib.FileMessage({ name: file.name, size: file.size, type: type, fileUrl: file.downloadUrl});
},
image: function(image){
return new RongIMLib.ImageMessage({content: image.thumbnail, imageUri: image.downloadUrl});
}
};
var getFileUrl = function(data){
urlItem[data.fileType](data);
}
//客服关闭
var endConversation = function(isCustomerService){
if (isCustomerService) {
//客服主动关闭
if (conversation.serviceState == 'people') {
$('.rcs-chat-wrapper')[0].innerHTML += utils.render(templates.evaluate,conversation.evaluate[0]);
} else {
evaluate(false);
}
} else {
if (conversation.closeStatus == 1) {
//用户主动关闭
$('.rcs-chat-wrapper')[0].innerHTML += templates.endconversation;
} else if (conversation.closeStatus == 2) {
//主动留言关闭
utils.removeNode('.rongcloud-leavemessage');
conversation.closeStatus = 1;
} else if (conversation.closeStatus == 3) {
//拉黑留言关闭
stopCustomerServer();
endComplete();
conversation.closeStatus = 1;
}
}
}
//完全关闭
var endComplete = function(){
$(".rcs-chat-wrapper")[0].innerHTML = '';
utils.hide($('.customer-service')[0]);
conversation.lastSendTime = 0;
conversation.announce = {};
conversation.messageContent = [];//完全退出清空数据
conversation.evaluateFormValue = {};
}
//只关闭当前窗口
var closeEvaluate = function(){
utils.removeNode('.rongcloud-evaluate');
}
//confirm
var confirm = function(){
//确定关闭
close();
if (conversation.serviceState == 'people') {
$('.rcs-chat-wrapper')[0].innerHTML += utils.render(templates.evaluate,conversation.evaluate[0]);
} else {
evaluate(false);
}
}
var close = function(){
//取消关闭
utils.removeNode('.rongcloud-layermbox');
}
var chatEnd = function(){
stopCustomerServer();//确定关闭了,先关闭客服链接
endComplete();
}
var star = function(num){
var starList = $('.satisfaction-star');
for (var i = 0; i < starList.length; i++) {
starList[i].className = "satisfaction-star";
if (i<num) {
starList[i].className = "satisfaction-star satisfaction-star-selected";
}
}
var evaluateObj = conversation.evaluate[num-1];
if (num == 5) {
evaluateObj.labelNameArray = [];
} else {
conversation.evaluateFormValue.isTagMust = evaluateObj.isTagMust;
conversation.evaluateFormValue.isInputMust = evaluateObj.isInputMust;
evaluateObj.labelNameArray = evaluateObj.labelName.split(',');
}
$('.rongcloud-evaluate-tag')[0].innerHTML = utils.render(templates.evaluateItem,evaluateObj);
}
var evaluate = function(isForm){
//评价
var callback = function(){
close();
$('.rcs-chat-wrapper')[0].innerHTML += templates.closebefore;
}
if (isForm) {
if (!validateEvaluate()) {
return;
} //表单验证
if (conversation.evaluate[0].isQuestionFlag != 1) {
conversation.evaluateFormValue.isresolve = -1;
}
var source = 0;
var starList = $('.satisfaction-star');
for (var i = 0; i < starList.length; i++) {
if (starList[i].className.indexOf("satisfaction-star-selected") != -1) {
source += 1;
}
}
conversation.evaluateFormValue.source = source;
conversation.evaluateFormValue.type = 1;
var msg = new RongIMClient.RegisterMessage.EvaluateMessage(conversation.evaluateFormValue);
console.log(msg);
console.log(conversation.evaluateFormValue);
RongIMClient.getInstance().sendMessage(conversation.targetType,conversation.id,msg,{
onSuccess: function() {
console.log('发送评价消息成功');
callback();
},
onError: function() {
}
});
} else {
callback();
}
}
//点击isresolve
var isresolve = function(event,num){
conversation.evaluateFormValue.isresolve = num;
var thisTarget = event.target || event.srcElement;
var solveList = $('.rongcloud-solve-tag');
for (var i = 0; i < solveList.length; i++) {
solveList[i].className = 'rongcloud-group-tag rongcloud-solve-tag';
}
thisTarget.className = 'rongcloud-group-tag rongcloud-solve-tag rongcloud-solve-active';
}
//tag点击
var tagClick = function(event){
var thisTarget = event.target || event.srcElement;
if (thisTarget.className.indexOf("rongcloud-group-tag-active") != -1) {
thisTarget.className = 'rongcloud-group-tag rongcloud-tag-item';
} else {
thisTarget.className = 'rongcloud-group-tag rongcloud-tag-item rongcloud-group-tag-active';
}
}
//评价表单验证
var validateEvaluate = function(){
var tagList = $('.rongcloud-tag-item');
var tag = [];
for (var i = 0; i < tagList.length; i++) {
if (tagList[i].className.indexOf("rongcloud-group-tag-active") != -1) {
tag.push(tagList[i].innerText);
}
}
conversation.evaluateFormValue.tag = tag.join();
conversation.evaluateFormValue.suggest = $('.rongcloud-evaluate-suggest')[0] ? $('.rongcloud-evaluate-suggest')[0].value : '';
if (conversation.evaluateFormValue.isTagMust) {
if (!conversation.evaluateFormValue.tag) {
showError('请选择存在的问题');
return false;
}
}
if (conversation.evaluateFormValue.isInputMust) {
if (!conversation.evaluateFormValue.suggest) {
showError('请输入评价内容');
return false;
}
}
return true;
}
//页面错误提示
function showError(str){
if ($('.rongcloud-errorInfo')[0]) {
return;
}
var node=document.createElement("div");
node.className = 'rongcloud-errorInfo';
node.innerText = str;
$('.rcs-chat-wrapper')[0].appendChild(node);
utils.fadein($('.rongcloud-errorInfo')[0]);
setTimeout(function(){
utils.fadeout($('.rongcloud-errorInfo')[0]);
setTimeout(function(){
$('.rcs-chat-wrapper')[0].removeChild(node);
},500);
},1000);
}
//主动发起评价
var startEvaluate = function(event){
var thisTarget = event.target || event.srcElement;
// thisTarget.parentNode.parentNode.removeChild(thisTarget.parentNode);
pullEva();
}
//客服发送评价
var pullEva = function(){
conversation.evaluateStatus = false;
$('.rcs-chat-wrapper')[0].innerHTML += utils.render(templates.evaluate,conversation.evaluate[0]);
}
//获取评价数据
// var getEvaluateValue = function(){
// var satisfactionList = document.getElementsByName('satisfaction');
// var source = '';
// for (var i = 0; i < satisfactionList.length; i++) {
// if (satisfactionList[i].checked) {
// source = satisfactionList[i].value;
// }
// }
// var suggest = document.getElementsByName('suggest')[0].value;
// return {
// source: source,
// suggest: suggest
// }
// }
//留言
var leavemessage = function(isblack){
if (isblack) {
conversation.closeStatus = 3;
} else {
conversation.closeStatus = 2;
}
var messageData = {};
// messageData.url = conversation.leaveMsgUrl;
messageData.list = conversation.formList;
$('.rcs-chat-wrapper')[0].innerHTML += render(templates.leaveword,messageData);
}
//留言提交
var leaveMessageComfirm = function(event){
event.preventDefault();
var formItemList = [];
for (var i = 0; i < conversation.formList.length; i++) {
formItemList.push(conversation.formList[i].name);
}
var isValidate = true;
for (var i = 0; i < formItemList.length; i++) {
var thisTarget = document.getElementsByName(formItemList[i])[0];
if (!validateLeaveMessage(i,thisTarget)) {
isValidate = false;
}
}
if (!isValidate) {
return;
}
var data = utils.getFormValue(formItemList);
var msg = new RongIMClient.RegisterMessage.LeaveMessage(data);//发送留言消息
var callback = function(){
stopCustomerServer();
endComplete();
}
sendMessage(msg,callback);
}
//留言表单验证
var validateLeaveMessage = function(index,eventOrTarget){
var verificationMap = {
email: '^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$',
phone: '^1\\d{10}$'
}
var thisTarget = (eventOrTarget.target || eventOrTarget.srcElement)? (eventOrTarget.target || eventOrTarget.srcElement):eventOrTarget;
var thisValue = thisTarget.value;
var validateStr = '';
var list = conversation.formList;
if (list[index].required) {
if (!thisValue) {
validateStr = list[index].message[0];
}
}
if (thisValue && list[index].verification) {
var reg = new RegExp(verificationMap[list[index].verification]);
if (!reg.test(thisValue)) {
validateStr = list[index].message[1];
}
}
if (thisValue && list[index].max) {
if (thisValue.length > list[index].max) {
validateStr = list[index].message[2];
}
}
var nextTarget = thisTarget.nextElementSibling;
if (validateStr) {
nextTarget.innerHTML = validateStr;
utils.show(nextTarget);
return false;
} else {
nextTarget.innerHTML = '';
utils.hide(nextTarget);
return true;
}
}
//最小化
var minimize = function(){
utils.hide($('.customer-service')[0]);
}
//预览图片
var viewImage = function(event){
var thisTarget = event.target || event.srcElement;
var image = {
imageUrl: thisTarget.getAttribute('data-img')
}
$('.imageViewBox')[0].innerHTML = render(templates.imageView,image);
utils.fadein($('.imageViewBox')[0]);
}
var escImageView = function(){
$('.imageViewBox')[0].innerHTML = '';
utils.fadeout($('.imageViewBox')[0]);
}
//用户表单验证
var validateUserInfo = function(eventOrTarget){
var verificationMap = {
name: '^[\u4E00-\u9FA5A-Za-z0-9]+$',
phone: '^1[3|4|5|7|8][0-9]{9}$',
email: '^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$'
}
var thisTarget = (eventOrTarget.target || eventOrTarget.srcElement)? (eventOrTarget.target || eventOrTarget.srcElement):eventOrTarget;
var thisValue = thisTarget.value;
var thisName = thisTarget.getAttribute('name');
var thisLabel = thisTarget.getAttribute('data-label');
var thisRequired = thisTarget.getAttribute('data-required');
var thisRule = thisTarget.getAttribute('data-pattern');
var validateStr = '';
if (thisRequired == 'required') {
if (!thisValue) {
validateStr = thisLabel+'不能为空';
}
}
if (thisValue && thisRule) {
var reg = new RegExp(verificationMap[thisName]);
if (!reg.test(thisValue)) {
validateStr = thisRule;
}
}
if (thisValue && thisName == 'name') {
if (thisValue.length > 20) {
validateStr = thisRule;
}
}
if (thisValue && thisName == 'email') {
if (thisValue.length > 30) {
validateStr = thisRule;
}
}
var nextTarget = thisTarget.nextElementSibling;
if (validateStr) {
nextTarget.innerHTML = validateStr;
utils.show(nextTarget);
return false;
} else {
nextTarget.innerHTML = '';
utils.hide(nextTarget);
return true;
}
}
//收集用户信息
var collectUserInfo = function(message){
utils.removeNode('.userInfoModel');
var userInfo = {};
userInfo.list = message.content.content.fields;
userInfoValue.formid = message.content.content.formid;
userInfoValue.submiturl = message.content.content.submiturl;
userInfoValue.data = [];
userInfoValue.wid = 1;
for (var i = 0; i < userInfo.list.length; i++) {
var infoObj = {};
infoObj.name = userInfo.list[i].name;
userInfoValue.data.push(infoObj);
}
$('.rcs-chat-wrapper')[0].innerHTML += render(templates.userInfo,userInfo);
}
//用户信息关闭
var userInfoClose = function(){
utils.removeNode('.userInfoModel');
userInfoValue = {};
}
//用户信息提交
var userInfoConfirm = function(event){
event.preventDefault();
var formItemList = [];
for (var i = 0; i < userInfoValue.data.length; i++) {
formItemList.push(userInfoValue.data[i].name);
}
var isValidate = true;
for (var i = 0; i < formItemList.length; i++) {
var thisTarget = document.getElementsByName(formItemList[i])[0];
if (!validateUserInfo(thisTarget)) {
isValidate = false;
}
}
if (!isValidate) {
return;
}
var data = utils.getFormValue(formItemList);
for (var i = 0; i < userInfoValue.data.length; i++) {
userInfoValue.data[i].value = data[userInfoValue.data[i].name];
}
var sendUserInfoMsg = {};
sendUserInfoMsg.content = userInfoValue;
var msg = new RongIMClient.RegisterMessage.UserInfo(sendUserInfoMsg);//发送用户信息提交消息
userInfoValue = {};
var callback = function(){
utils.removeNode('.userInfoModel');
};
sendMessage(msg,callback);
}
//下载历史消息
var getHistoryMsgFile = function(){
var msg = new RongIMClient.RegisterMessage.DownloadHistoryMessage({
begin: 0
});
var callback = function(){};
sendMessage(msg,callback);
}
//自定义消息注册
var registerMessage = function() {
var messageName = "ProductMessage"; // 消息名称。
var objectName = "cs:product"; // 消息内置名称,请按照此格式命名。
var mesasgeTag = new RongIMLib.MessageTag(true, true);// 消息是否保存是否计数,true true 保存且计数,false false 不保存不计数。
var propertys = ["title", "url", "content", "imageUrl", "extra"]; // 消息类中的属性名。
// RongIMLib.RongIMClient.registerMessageType(messageName, objectName, mesasgeTag, propertys);
//评价下行消息
RongIMLib.RongIMClient.registerMessageType("PullEvaMessage", "RC:CsPullEva", mesasgeTag, ['content']);
//评价上行消息
RongIMLib.RongIMClient.registerMessageType("EvaluateMessage", "RC:CsEva", mesasgeTag, ['sid','pid','uid','source','isresolve','tag','suggest','type']);
//留言下行消息
RongIMLib.RongIMClient.registerMessageType("PullLeaveMessage", "RC:CsPLM", mesasgeTag, ['content']);
//留言上行消息
RongIMLib.RongIMClient.registerMessageType("LeaveMessage", "RC:CsLm", mesasgeTag, ['msg_content','msg_email','msg_name','msg_tel']);
// 收集信息下行消息
RongIMLib.RongIMClient.registerMessageType("CollectUserInfo", "RC:CsCEI", mesasgeTag, ['content','user']);
RongIMLib.RongIMClient.registerMessageType("UserInfo", "RC:CsEI", mesasgeTag, ['content']);
// RC:CsDHM //下载历史消息 先发送这个类型的消息 上行消息
RongIMLib.RongIMClient.registerMessageType("DownloadHistoryMessage", "RC:CsDHM", mesasgeTag, ['begin']);
// RC:CsHM 接受这个类型的消息 下行消息
RongIMLib.RongIMClient.registerMessageType("HistoryMessage", "RC:CsHM", mesasgeTag, ['fileUrl','name','size','type']);
}
//sdk初始化
var sdkInit = function(params, callbacks){
if(window.navigator.onLine==false) { 
params.disconnectedCallback && params.disconnectedCallback();
return;
  }//如果第一次没有连接网络,直接回调
if (sdkConnect == 2) {
if (!conversation.connect) {
params.connectingCallback && params.connectingCallback();
callbacks.getInstance && callbacks.getInstance(RongIMClient.getInstance());
conversation.id = params.customerServiceId;
}
createButton(params);
return;
} else if (sdkConnect == 1){
return;
}
var initTimes = 0;
sdkConnect = 1;//1为连接中
params.connectingCallback && params.connectingCallback();//连接中回调
var appKey = params.appKey;
var token = params.token;
var navi = params.navi || "";
if(navi !== ""){
//私有云
var config = {
navi : navi
};
console.log("私有云");
console.log(params);
RongIMLib.RongIMClient.init(appKey,null,config);
}else{
//公有云
console.log("公有云");
console.log(params);
RongIMLib.RongIMClient.init(appKey);
}
if (RCS.config.upload && RCS.config.upload.fileServer) {
RCS.fileConfig.domain = RCS.config.upload.fileServer;
}
var instance = RongIMClient.getInstance();
// 连接状态监听器
RongIMClient.setConnectionStatusListener({
onChanged: function (status) {
console.log(status);
var connectDom = $('.rcs-connect-status')[0];
if (connectDom) {
connectDom.style.display = 'block';
}
switch (status) {
case RongIMLib.ConnectionStatus.CONNECTED:
if (connectDom) {
connectDom.style.display = 'none';
}
sdkConnect = 2;
initTimes++;
callbacks.getInstance && callbacks.getInstance(instance);
break;
case RongIMLib.ConnectionStatus.CONNECTING:
console.log('正在链接');
break;
case RongIMLib.ConnectionStatus.DISCONNECTED:
console.log('断开连接');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
case RongIMLib.ConnectionStatus.KICKED_OFFLINE_BY_OTHER_CLIENT:
console.log('其他设备登录');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
case RongIMLib.ConnectionStatus.DOMAIN_INCORRECT:
console.log('域名不正确');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
case RongIMLib.ConnectionStatus.NETWORK_UNAVAILABLE:
console.log('网络不可用');
// sdkConnect = 0;
// params.disconnectedCallback && params.disconnectedCallback();
break;
case RongIMLib.ConnectionStatus.DISCONNECTED:
console.log('断开连接');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
case 4:
console.log('token无效');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
default:
console.log('未知错误');
sdkConnect = 0;
params.disconnectedCallback && params.disconnectedCallback();
break;
}
}
});
RongIMClient.setOnReceiveMessageListener({
// 接收到的消息
onReceived: function (message) {
// 判断消息类型
console.log("新消息: " + message.targetId);
if (message.offLineMessage) {
return;
}
console.log(message);
var systemMsg = null;
switch(message.messageType){
case 'HandShakeResponseMessage'://客服握手响应
params.connectedCallback && params.connectedCallback();
setConversition(message);
openConversation(conversation.id);
if (message.content.data.serviceType == 1 || message.content.data.serviceType == 3) {//仅机器人、机器人优先
if (message.content.data.robotWelcome) {addCustomServiceInfo(message.content.data);}
changeServiceState('robot');
} else {
changeServiceState('people');
}
if (message.content.data.isblack == 1) {
//拉进了黑名单,留言页面
console.log(message.content.data.isblack);
leavemessage(true);
}
break;
case 'ChangeModeResponseMessage'://转人工
systemMsg = changeModeResponse(message);
break;
case 'TerminateMessage'://客服主动结束会话
if ($('.imageViewBox')[0]) {
utils.fadeout($('.imageViewBox')[0]);
}
if ($('.rongcloud-layermbox')[0]) {
return;
}
if (!conversation.connect) {
return;
}
if (message.content.code == 0 || conversation.evaEntryPoint == 3) {
//评价
endConversation(true);//关闭,评价
} else {
changeServiceState('robot');
}
break;
case 'CustomerStatusUpdateMessage'://状态改变
changeServiceState('people');
break;
case 'InformationNotificationMessage'://提示语
updateMessage(message);
break;
case 'InfoNtf'://提示语灰条消息
updateMessage(message);
break;
case 'SuspendMessage'://用户主动关闭
stopCustomerServer();
endComplete();
break;
case 'PullEvaMessage':
//客服主动下发评价,只评价不做任何操作
pullEva();
break;
case 'CollectUserInfo':
//客服发起收取用户信息消息
collectUserInfo(message);
break;
case "HistoryMessage"://下载历史消息
var url = message.content.fileUrl;
var name = message.content.name;
utils.downloadHistoryMsgFile(url, name);
//下载文件
break;
case "TextMessage"://文本消息
updateMessage(message);
break;
case "ImageMessage"://图片消息
updateMessage(message);
break;
case "FileMessage"://文件消息
updateMessage(message);
break;
case "VoiceMessage"://声音消息
updateMessage(message);
break;
case "PullLeaveMessage"://留言消息
updateMessage(message);
break;
default:
callbacks.receiveNewMessage && callbacks.receiveNewMessage(message);
break;
}
if (systemMsg) {
console.log(systemMsg);
addServiceTip(systemMsg);
}
}
});
//开始链接
RongIMClient.connect(token, {
onSuccess: function(userId) {
callbacks.getCurrentUser && callbacks.getCurrentUser({userId:userId});
console.log("链接成功,用户id:" + userId);
if (initTimes == 1) {
callbacks.enterConversation && callbacks.enterConversation();
}
initTimes++;
},
onTokenIncorrect: function() {
console.log('token无效');
params.disconnectedCallback && params.disconnectedCallback();
},
onError:function(errorCode){
console.log("=============================================");
console.log(errorCode);
params.disconnectedCallback && params.disconnectedCallback();
}
});
}
//客服会话初始化一些数据
var setConversition = function(msg){
if (msg.content.data.leaveMsgConf && msg.content.data.leaveMsgConf.defaultConf) {
conversation.formList = msg.content.data.leaveMsgConf.defaultConf;
}
conversation.announce = {
"announceMsgFlag": msg.content.data.announceMsgFlag,
"announceMsg": msg.content.data.announceMsg,
"announceClickFlag": msg.content.data.announceClickFlag,
"announceClickUrl": msg.content.data.announceClickUrl
};
conversation.evaluateFormValue.uid = msg.content.data.uid;
conversation.evaluateFormValue.pid = msg.content.data.pid;
conversation.evaluateFormValue.sid = msg.content.data.sid;
if (msg.content.data.needTypSts == 1) {
conversation.needTypSts = 1;
}
// if (msg.content.data.leaveMsgConf) {
// conversation.leaveMsgUrl = msg.content.data.leaveMsgConf.customConf.url;
// }
if (msg.content.data.evaConf) {
switch(msg.content.data.evaConf.evaEntryPoint){
case 1:
//啥都不用干
conversation.evaEntryPoint = 1;
break;
case 2:
//用户不能主动评价
conversation.evaEntryPoint = 2;
break;
case 3:
//结束会话弹出评价
conversation.evaEntryPoint = 3;
break;
}
}
}
//创建button
var createButton = function(config){
var obj = {
"showButton": config.showButton
}
if (!$('.customer-service')[0]) {
config.target.innerHTML = render(templates.button, obj);
}
if (conversation.connect) {
showCommon();
return;
}
createConversation(config);
addListener();
if (!config.showButton) {
showCommon();
}
}
//监听留言提交,页面关闭
var addListener = function(){
var callback = function(phoneOrPc){
terminal = phoneOrPc;
}
utils.browserRedirect(callback);
if (terminal == 'pc') {
document.body.onclick = function(){
var inputMsg = $(".rongcloud-text")[0];
hideEmoji();
}
if (Notification.permission === "granted") {
supportNot = true;
}
// Otherwise, we need to ask the user for permission
else if (Notification.permission !== "denied") {
Notification.requestPermission(function (permission) {
// If the user accepts, let's create a notification
if (permission === "granted") {
supportNot = true;
}
});
}
} else {
document.body.ontouchstart = function(event){
if (event.target.className.indexOf('emojiItem') < 0 && event.target.className.indexOf('rong-emoji-content') < 0 && event.target.className.indexOf('rongcloud-expressionContent') < 0 ) {
hideEmoji();
}
if (event.target.className.indexOf('rongcloud-rong-btn') < 0 && event.target.className.indexOf('rongcloud-text') < 0) {
var inputMsg = $(".rongcloud-text")[0];
if (inputMsg) {
inputMsg.blur();
}
}
}
}
window.addEventListener('message',function(e){
if (e.origin == 'https://web.jiaxincloud.com') {
if (e.data == 'success') {
utils.removeNode('.rongcloud-leavemessage');
}
}
},false);
window.onbeforeunload = function(event) {
stopCustomerServer();
};
}
var hideEmoji = function(){
var emojiContent = $('.rongcloud-expressionWrap')[0];
if (emojiContent) {
utils.hide(emojiContent);
}
}
//button点击事件
var showCommon = function(){
if (conversation.connect) {
if ($('.customer-service')[0].style.display != 'none') {
utils.hide($('.customer-service')[0]);
} else {
utils.show($('.customer-service')[0]);
if (!$('.rcs-chat-wrapper')[0]) {
createConversation(conversation.id);
openConversation(conversation.id);
}
}
} else {
console.log(conversation.id);
startCustomerServer(conversation.id);
utils.show($('.customer-service')[0]);
}
}
//cs组件初始化
var init = function(config){
RCS.config = config;
var callbacks = {
getInstance : function(instance){
var callback = function(){
if (RCS.config.templates) {
for (var index in RCS.config.templates) {
if (!RCS.config.showButton && index == 'button') {
break;
}
templates[index] = RCS.config.templates[index];
}
}
}
getTemplates(callback);
emoji.init();
RongIMLib.RongIMVoice.init();
registerMessage();
},
getCurrentUser : function(userInfo){
console.log(userInfo.userId);
},
enterConversation : function(){
conversation.id = config.customerServiceId;
createButton(config);
}
};
sdkInit(config,callbacks);
};
var openNotice = function(url){
window.open(url);
}
//H5唤醒键盘的时候输入框显示在视野内
var keyboard = function(event){
var thisTarget = event.target || event.srcElement;
setTimeout(function(){
thisTarget.scrollIntoView(true);
},500)
}
//对外暴露
RCS.init = init;
RCS.send = send;
RCS.keySend = keySend;
RCS.showemoji = showemoji;
RCS.chooseEmoji = chooseEmoji;
RCS.loadHisMessages = loadHisMessages;
RCS.scrollBottom = scrollBottom;
RCS.imgUpload = imgUpload;
RCS.fileUpload = fileUpload;
RCS.switchPerson = switchPerson;
RCS.endConversation = endConversation;
RCS.play = play;
RCS.playVideo = playVideo;
RCS.minimize = minimize;
RCS.showCommon = showCommon;
RCS.confirm = confirm;
RCS.close = close;
RCS.evaluate = evaluate;
RCS.star = star;
RCS.startEvaluate = startEvaluate;
RCS.leavemessage = leavemessage;
RCS.leaveMessageComfirm = leaveMessageComfirm;
RCS.validateUserInfo = validateUserInfo;
RCS.validateLeaveMessage = validateLeaveMessage;
RCS.viewImage = viewImage;
RCS.escImageView = escImageView;
RCS.userInfoClose = userInfoClose;
RCS.userInfoConfirm = userInfoConfirm;
RCS.getHistoryMsgFile = getHistoryMsgFile;
RCS.keyboard = keyboard;
RCS.chatEnd = chatEnd;
RCS.openNotice = openNotice;
RCS.isresolve = isresolve;
RCS.tagClick = tagClick;
})(RCS);
\ No newline at end of file
... ...
此 diff 太大无法显示。
;(function(RCS){
var emoji = {
init : function(){
RongIMLib.RongIMEmoji.init();
},
emojiToHTML : function(emojiContent){
return RongIMLib.RongIMEmoji.emojiToHTML(emojiContent,24);
},
symbolToEmoji : function(sym){
return RongIMLib.RongIMEmoji.symbolToEmoji(sym);
},
getEmoji : function(){
return RongIMLib.RongIMEmoji.list.map(function(data) {
return data.node;
});
}
}
RCS.emoji = emoji;
})(RCS);
\ No newline at end of file
... ...
{
"name": "customer-service",
"version": "1.0.0",
"description": "customerService",
"scripts": {
"dist": "grunt dist"
},
"devDependencies": {
"glog": "^1.7.0",
"grunt": "^1.0.1",
"grunt-contrib-clean": "^1.1.0",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-cssmin": "^2.2.0",
"grunt-contrib-uglify": "^3.0.1"
}
}
... ...
(function(win) {
function forEach(m, callback) {
for (var key in m) {
callback(key, m[key]);
}
}
function buildUrl(url, items) {
var query = '';
forEach(items, function(name, value) {
if (name != 'token') {
query += (query ? '&' : '') + encodeURIComponent(name) + '=' + encodeURIComponent(value);
}
});
if (query) {
url += (url.indexOf('?') > 0 ? '&' : '?') + query;
}
return url;
}
function encode2UTF8(argString) {
if (argString === null || typeof argString === 'undefined') {
return '';
}
var string = (argString + ''); // .replace(/\r\n/g, '\n').replace(/\r/g, '\n');
var utftext = '',
start, end, stringl = 0;
start = end = 0;
stringl = string.length;
for (var n = 0; n < stringl; n++) {
var c1 = string.charCodeAt(n);
var enc = null;
if (c1 < 128) {
end++;
} else if (c1 > 127 && c1 < 2048) {
enc = String.fromCharCode(
(c1 >> 6) | 192, (c1 & 63) | 128
);
} else if (c1 & 0xF800 ^ 0xD800 > 0) {
enc = String.fromCharCode(
(c1 >> 12) | 224, ((c1 >> 6) & 63) | 128, (c1 & 63) | 128
);
} else { // surrogate pairs
if (c1 & 0xFC00 ^ 0xD800 > 0) {
throw new RangeError('Unmatched trail surrogate at ' + n);
}
var c2 = string.charCodeAt(++n);
if (c2 & 0xFC00 ^ 0xDC00 > 0) {
throw new RangeError('Unmatched lead surrogate at ' + (n - 1));
}
c1 = ((c1 & 0x3FF) << 10) + (c2 & 0x3FF) + 0x10000;
enc = String.fromCharCode(
(c1 >> 18) | 240, ((c1 >> 12) & 63) | 128, ((c1 >> 6) & 63) | 128, (c1 & 63) | 128
);
}
if (enc !== null) {
if (end > start) {
utftext += string.slice(start, end);
}
utftext += enc;
start = end = n + 1;
}
}
if (end > start) {
utftext += string.slice(start, stringl);
}
return utftext;
}
// Copy 七牛 SDK 方法
function encode2Base64(data) {
var b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
var o1, o2, o3, h1, h2, h3, h4, bits, i = 0,
ac = 0,
enc = '',
tmp_arr = [];
if (!data) {
return data;
}
data = encode2UTF8(data + '');
do { // pack three octets into four hexets
o1 = data.charCodeAt(i++);
o2 = data.charCodeAt(i++);
o3 = data.charCodeAt(i++);
bits = o1 << 16 | o2 << 8 | o3;
h1 = bits >> 18 & 0x3f;
h2 = bits >> 12 & 0x3f;
h3 = bits >> 6 & 0x3f;
h4 = bits & 0x3f;
// use hexets to index into b64, and append result to encoded string
tmp_arr[ac++] = b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4);
} while (i < data.length);
enc = tmp_arr.join('');
switch (data.length % 3) {
case 1:
enc = enc.slice(0, -2) + '==';
break;
case 2:
enc = enc.slice(0, -1) + '=';
break;
}
return enc;
}
// Copy 七牛 SDK 方法
function URLSafeBase64Encode(v) {
v = encode2Base64(v);
return v.replace(/\//g, '_').replace(/\+/g, '-');
}
function chunkLastStep(data, opts, callback) {
// 七牛 URL 规定
var key = '/key/' + URLSafeBase64Encode(data.filename);
var fname = '/fname/' + URLSafeBase64Encode(data.filename);
var url = opts.domain + '/mkfile/' + data.size + key + fname;
var options = {
domain: url,
method: 'POST',
headers: {
'Content-Type': 'application/octet-stream'
},
multi_parmas: opts.multi_parmas,
support_options: true,
stream: true
};
uploadData(data.ctx, options, {
onCompleted: function(res) {
res.filename = data.filename;
res.name = data.name;
callback.onCompleted(res);
},
onError: function() {
throw new Error('qiniu uploadChunk error');
},
onProgress: function(chunkLoaded, total) {},
onOpen: function(xhr) {
callback.onOpen(xhr);
}
});
}
var offset = 0,
ctxStore = {};
function uploadNextChunk(blob, opts, callback) {
var chunk = Math.ceil(offset / opts.chunk_size),
chunks = Math.ceil(blob.size / opts.chunk_size),
curChunkSize = Math.min(opts.chunk_size, blob.size - offset),
chunkBlob = blob.slice(offset, offset + curChunkSize),
chunkInfo = {
chunk: chunk,
chunks: chunks,
name: blob.uniqueName
};
forEach(chunkInfo, function(key, value) {
opts.multi_parmas[key] = value;
});
opts.filesize = blob.size;
opts.headers = {
'Content-Type': 'application/octet-stream'
};
opts.isChunk = true;
uploadData(chunkBlob, opts, {
onCompleted: function(chunkRes) {
offset += curChunkSize;
// callback.onProgress(Math.floor((chunk + 1) / chunks * blob.size), blob.size);
ctxStore[blob.uniqueName] = ctxStore[blob.uniqueName] || [];
ctxStore[blob.uniqueName].push(chunkRes.ctx);
if (offset < blob.size) {
if (chunkRes.ctx) {
uploadNextChunk(blob, opts, callback);
}else{
offset = 0;
delete ctxStore[blob.uniqueName]
}
} else {
offset = 0;
delete opts.isChunk;
delete opts.headers['Content-Type'];
forEach(chunkInfo, function(key, value) {
delete opts.multi_parmas[key];
});
var ctx = ctxStore[blob.uniqueName].join(',');
var data = {
ctx: ctx,
name: blob.name,
size: blob.size,
filename: blob.uniqueName
};
chunkLastStep(data, opts, callback);
}
},
onError: function() {
throw new Error('qiniu uploadChunk error');
},
onProgress: function(chunkLoaded, total) {
var loaded = chunkLoaded + offset;
callback.onProgress(loaded, opts.filesize);
},
onOpen: function(xhr) {
callback.onOpen(xhr);
}
});
}
function uploadData(data, options, callback) {
var xhr = new XMLHttpRequest();
if (xhr.upload && options.support_options) {
xhr.upload.onprogress = function(event) {
callback.onProgress(event.loaded, event.total);
};
}
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
var result = xhr.responseText || "{}";
result = JSON.parse(result);
result.filename = options.unique_value;
callback.onCompleted(result);
}
};
var url = options.domain;
if (options.isChunk) {
url += '/mkblk/' + data.size;
url = buildUrl(url, options.multi_parmas);
}
xhr.open(options.method, url, true);
callback.onOpen(xhr);
if (options.stream) {
xhr.setRequestHeader('authorization', 'UpToken ' + options.multi_parmas.token);
}
forEach(options.headers, function(key, value) {
xhr.setRequestHeader(key, value);
});
xhr.send(data);
}
function uploadQiniu(file, opts, callback) {
if (file.size && opts.chunk_size < file.size) {
var uniqueName = opts['genUId'](file);
var suffix = file.name.substr(file.name.lastIndexOf('.'));
uniqueName = uniqueName + suffix;
file.uniqueName = uniqueName;
opts.stream = true;
uploadNextChunk(file, opts, callback);
} else {
var data = opts['data'](file, opts);
uploadData(data, opts, callback);
}
}
win.uploadProcess = uploadQiniu;
})(window);
\ No newline at end of file
... ...
;(function(RCS){
var getTemplates = function(callback){
var list = {
button: 'templates/button.html',
chat: 'templates/chat.html',
closebefore: 'templates/closebefore.html',
conversation: 'templates/conversation.html',
endconversation: 'templates/endconversation.html',
evaluate: 'templates/evaluate.html',
imageView: 'templates/imageView.html',
leaveword: 'templates/leaveword.html',
main: 'templates/main.html',
message: 'templates/message.html',
messageTemplate: 'templates/messageTemplate.html',
userInfo: 'templates/userInfo.html',
evaluateItem: 'templates/evaluateItem.html',
};
var templates = {};
for (var key in list) {
var url = list[key];
var html = RCS.templateCache[url];
if (html) {
templates[key] = html;
} else {
var xhr = new XMLHttpRequest();
xhr.open('get', url, false);
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200) {
templates[key] = xhr.responseText;
}
}
xhr.send(null);
}
}
return templates;
}
RCS.getTemplates = getTemplates;
})(RCS);
\ No newline at end of file
... ...
<!-- class="customer-service"主页面容器,类名不能修改 -->
<div class="rongcloud-consult">
<button onclick="RCS.showCommon()"><span>咨询客服</span></button>
</div>
<div class="customer-service" style="display: none;"></div>
\ No newline at end of file
... ...
<!--
class="rongcloud-text"消息输入框;
class="rongcloud-expressionContent"表情容器;
class="rcs-message-box"消息列表容器;
class="rongcloud-Messages-history"查看更多消息按钮;
class="rongcloud-mode1"、class="rongcloud-mode2"人工、机器人转换按钮的容器(机器人状态时,rongcloud-mode1隐藏,rongcloud-mode1显示);
class="rcs-connect-status"connect断开时,状态显示的容器
class="imageViewBox"图片预览容器
以上类名不能被修改
-->
<div class="rongcloud-kefuChat">
<div id="header" class="rongcloud-rong-header rongcloud-blueBg rongcloud-online">
{%if(this.terminal == 'phone'){%}
<span class="rongcloud-phone-exit" onclick="RCS.endConversation()"></span>
<div class="rongcloud-phone-infoBar">
<span class="rongcloud-phone-kefuName">客服</span>
</div>
{%}else{%}<div class="rongcloud-infoBar rongcloud-pull-left">
<div class="rongcloud-infoBarTit">
<span class="rongcloud-kefuName">客服</span>
</div>
</div>
<div class="rongcloud-toolBar rongcloud-headBtn rongcloud-pull-right">
<div class="rongcloud-voice"></div>
<a onclick="RCS.minimize()" class="rongcloud-kefuChatBoxHide rongcloud-sprite" title="隐藏"></a>
<a onclick="RCS.endConversation()" class="rongcloud-kefuChatBoxClose rongcloud-sprite" title="结束对话"></a>
</div>{%}%}
</div>
<div class="rongcloud-box">
<div class="rongcloud-outlineBox rcs-connect-status" style="display:none;">
<div class="rongcloud-sprite"></div>
<span>连接断开,请刷新重连</span>
</div>
{%if(this.announce.announceMsgFlag == 1){%}
<div class="rongcloud-noticeBox {%if(this.announce.announceClickFlag == 1){%} rongcloud-link {%}%}" {%if(this.announce.announceClickFlag == 1){%} onclick='RCS.openNotice({%JSON.stringify(this.announce.announceClickUrl)%})' {%}%}>
<div class="rongcloud-notice-horn"></div>
<span class="rongcloud-noticeBox-content">{%this.announce.announceMsg%}</span>
{%if(this.announce.announceClickFlag == 1){%}<div class="rongcloud-notice-link"></div>{%}%}
</div>
{%}%}
</div>
<div id="rcs-message-list" class="rcs-message-box {%if(this.announce.announceMsgFlag == 1){%} rongcloud-hasNotice {%}%}">
{%this.messageList%}
</div>
<div id="rcs-chat-box" class="rongcloud-rong-footer">
<div class="rongcloud-footer-con">
<div class="rongcloud-text-layout">
<div id="funcPanel" class="rongcloud-funcPanel rongcloud-robotMode">
<div class="rongcloud-MessageForm-tool" id="expressionWrap" style="overflow: visible;">
<i class="rongcloud-sprite rongcloud-iconfont-smile" onclick="RCS.showemoji(event)"></i>
<div class="rongcloud-expressionWrap" onclick="RCS.chooseEmoji(event)" style="display: none;">
<div class="rongcloud-expressionContent"></div>
</div>
</div>
<div class="rongcloud-mode1" style="display: none;">
<div class="rongcloud-MessageForm-tool">
<i class="rongcloud-sprite rongcloud-iconfont-upload" id="upload-image">
<input type="file" multiple="multiple" accept="image/png,image/gif,image/jpeg" onchange="RCS.imgUpload(event)"></input>
</i>
</div>
<!-- <div class="rongcloud-MessageForm-tool">
<i class="rongcloud-sprite rongcloud-iconfont-file" id="upload-file">
<input type="file" multiple="multiple" onchange="RCS.fileUpload(event)"></input>
</i>
</div> -->
<!-- <div class="rongcloud-MessageForm-tool">
<i class="rongcloud-sprite rongcloud-iconfont-download" id="download-his" onclick="RCS.getHistoryMsgFile()">
</i>
</div> -->
{%if(this.evaEntryPoint == 1){%}
<div class="rongcloud-MessageForm-tool">
<i class="rongcloud-sprite rongcloud-iconfont-evaluate" onclick="RCS.startEvaluate(event)">
</i>
</div>{%}%}
</div>
<div class="rongcloud-mode2"><a onclick="RCS.switchPerson()" id="chatSwitch" class="rongcloud-chatSwitch">转人工服务</a></div>
</div>
</div>
</div>
<div class="rongcloud-footer-input">
<div class="rongcloud-footer-textarea"">
<textarea class="rongcloud-text rongcloud-grey" placeholder="请输入文字..." onfocus="RCS.keyboard(event)" onkeydown="RCS.keySend(event)"></textarea>
</div>
<button type="button" style="background-color: #0099ff;" class="rongcloud-rong-btn rongcloud-rong-send-btn" id="rong-sendBtn" onclick="RCS.send(event)">发送</button>
</div>
</div>
</div>
<div class="rebox imageViewBox" onclick="RCS.escImageView()" style="display: none;">
</div>
\ No newline at end of file
... ...
<!-- 客服主动关闭弹出的页面 -->
<div class="rongcloud-layermbox">
<div class="rongcloud-laymshade"></div>
<div class="rongcloud-layermmain">
<div class="rongcloud-section">
<div class="rongcloud-layermchild rongcloud-endconversation">
<p class="rongcloud-prompt">客服会话已结束</p>
<div class="rongcloud-buttons" onclick="RCS.chatEnd()"><button class="rongcloud-button">确定</button></div>
</div>
</div>
</div>
</div>
\ No newline at end of file
... ...
<!-- 会话列表每一个会话
class="rong-conversation"会话列表中的每一个会话
此类名不能被修改
-->
<div class="rong-conversation" _cid="{%this.cid%}" _name="{%this.name%}">
<img src="https://bsetting60.ntalker.com/application/static/setting/images/head.jpg" alt="">
<span class="rong-conversation-name">客服{%this.cid%} - {%this.name%}</span>
<div class="rong-conversation-message">...</div>
</div>
\ No newline at end of file
... ...
<!-- endconversation: 用户主动关闭弹出的页面
class="rongcloud-layermbox"弹出层容器
此类名不能被修改
-->
<div class="rongcloud-layermbox">
<div class="rongcloud-laymshade"></div>
<div class="rongcloud-layermmain">
<div class="rongcloud-section">
<div class="rongcloud-layermchild rongcloud-endconversation">
<p class="rongcloud-prompt">是否要结束当前会话?</p>
<div class="rongcloud-buttons"><button class="rongcloud-button" onclick="RCS.confirm()"></button><button class="rongcloud-button" onclick="RCS.close()"></button></div>
</div>
</div>
</div>
</div>
\ No newline at end of file
... ...
<!-- evaluate: 评价页面
class="rongcloud-evaluate"评价弹出层容器;
class="rongcloud-evaluate-tag"评价tag容器;
此类名不能被修改
-->
<div class="rongcloud-layermbox rongcloud-evaluate">
<div class="rongcloud-laymshade"></div>
<div class="rongcloud-layermmain">
<div class="rongcloud-section">
<div class="rongcloud-layermchild rongcloud-evaluate">
<div class="rongcloud-layer-title">评价客服</div>
<div class="rongcloud-layer-body">
{%if(this.isQuestionFlag == 1){%}
<div class="rongcloud-group-row">
<div class="rongcloud-group-title">请问客服是否解决了您的问题</div>
<div class="rongcloud-group-tag-list">
<div class="rongcloud-group-tag rongcloud-solve-tag rongcloud-solve-active" onclick="RCS.isresolve(event,1)">已解决</div>
<div class="rongcloud-group-tag rongcloud-solve-tag" onclick="RCS.isresolve(event,0)">未解决</div>
</div>
</div>{%}%}
<div class="rongcloud-group-row">
<div class="rongcloud-group-title">请您对客服进行评价</div>
<span class="satisfaction-star satisfaction-star-selected" onclick="RCS.star(1)"></span>
<span class="satisfaction-star satisfaction-star-selected" onclick="RCS.star(2)"></span>
<span class="satisfaction-star satisfaction-star-selected" onclick="RCS.star(3)"></span>
<span class="satisfaction-star satisfaction-star-selected" onclick="RCS.star(4)"></span>
<span class="satisfaction-star satisfaction-star-selected" onclick="RCS.star(5)"></span>
</div>
<div class="rongcloud-evaluate-tag">
</div>
</div>
<div class="rongcloud-foot">
<button class="rongcloud-evaluate-btn" onclick="RCS.evaluate(true)">提交</button><button class="rongcloud-evaluate-btn" onclick="RCS.evaluate(false)">取消</button>
</div>
</div>
<!--反馈提示-->
<!-- <div class="rongcloud-layermchild rongcloud-feedback" ng-show="end">
<div class="rongcloud-layermcont">
感谢您的反馈 ^ - ^ !
</div>
</div> -->
</div>
</div>
</div>
... ...
{%if(this.labelNameArray.length != 0){%}
<div class="rongcloud-group-row">
<div class="rongcloud-group-title">存在哪些问题{%if(this.isTagMust == 1){%}(必填){%}%}</div>
<div class="rongcloud-group-tag-list">
{%for(var index in this.labelNameArray){%}
<div class="rongcloud-group-tag rongcloud-tag-item" onclick="RCS.tagClick(event)">{%this.labelNameArray[index]%}</div>
{%}%}
</div>
</div>
<div class="rongcloud-group-row">
<textarea class="rongcloud-evaluate-suggest rongcloud-suggest" placeholder="其他想说的"></textarea>
</div>
{%}%}
\ No newline at end of file
... ...
<!-- imageView: 图片预览页面 -->
<a href="#" class="rebox-close rebox-button">×</a>
<div class="rebox-contents">
<img src="{%this.imageUrl%}" class="rebox-content">
</div>
... ...
<script id="rcs-templte-button" type="rcs/templte">
<!--#include file="button.html"-->
</script>
<script id="rcs-templte-main" type="rcs/templte">
<!--#include file="main.html"-->
</script>
<script id="rcs-templte-conversation" type="rcs/templte">
<!--#include file="conversation.html"-->
</script>
<script id="rcs-templte-chat" type="rcs/templte">
<!--#include file="chat.html"-->
</script>
<script id="rcs-templte-message" type="rcs/templte">
<!--#include file="message.html"-->
</script>
<script id="rcs-templte-message-template" type="rcs/templte">
<!--#include file="messageTemplate.html"-->
</script>
<script id="rcs-templte-closebefore" type="rcs/templte">
<!--#include file="closebefore.html"-->
</script>
<script id="rcs-templte-endconversation" type="rcs/templte">
<!--#include file="endconversation.html"-->
</script>
<script id="rcs-templte-evaluate" type="rcs/templte">
<!--#include file="evaluate.html"-->
</script>
<script id="rcs-templte-leaveword" type="rcs/templte">
<!--#include file="leaveword.html"-->
</script>
<script id="rcs-templte-imageView" type="rcs/templte">
<!--#include file="imageView.html"-->
</script>
<script id="rcs-templte-userInfo" type="rcs/templte">
<!--#include file="userInfo.html"-->
</script>
\ No newline at end of file
... ...
<!-- leaveword: 留言页面
class="rongcloud-leavemessage"留言弹出层容器
此类名不能被修改-->
<div class="rongcloud-leavemessage">
{%if(this.url){%}
<iframe id="leavewordIframe" src="{%this.url%}" frameborder="0" width="100%;" height="100%;"></iframe>
{%}else{%}
<div class="rongcloud-leavemessage-title">您好,请留言~</div>
<form>
{%for(var index in this.list){%}
<div class="rongcloud-form-item">
<label class="{%if(this.list[index].required){%}{%'rongcloud-require'%}{%}%}">{%this.list[index].title%}:</label>
{%if(this.list[index].type == 'text'){%}<input class="rongcloud-inputtext" name="{%this.list[index].name%}" placeholder="{%this.list[index].defaultText%}" type="text" onblur="RCS.validateLeaveMessage({%index%}, event)"></input>{%}else{%}
<textarea name="{%this.list[index].name%}" placeholder="{%this.list[index].defaultText%}" onblur="RCS.validateLeaveMessage({%index%}, event)"></textarea>{%}%}
<div class="rongcloud-form-error" style="display: none;"></div>
</div>{%}%}
<div class="rongcloud-leavemessage-form-btns">
<button class="rongcloud-btn" onclick="RCS.leaveMessageComfirm(event)">提交</button>
</div>
</form>{%}%}
</div>
\ No newline at end of file
... ...
<!-- main: 包括客服列表和聊天窗口的主页面
class="rcs-chat-wrapper"聊天窗口的容器
此类名不能被修改
-->
<div id="rcs-main" class="rongcloud-kefuListBox rongcloud-container">
{%if(this.showConversitionList){%}<div class="rongcloud-kefuList">
<div class="rongcloud-rong-header rongcloud-blueBg">
<div class="rongcloud-toolBar rongcloud-headBtn">
<div class="rongcloud-voice"></div>
<div class="rongcloud-sprite rongcloud-people"></div>
<span class="rongcloud-recent">客服列表</span>
<div class="rongcloud-sprite rongcloud-arrow-down cursor-pointer" onclick="RCS.minimize()"></div>
</div>
</div>
<div class="rongcloud-content">
<div class="rongcloud-netStatus" style="display:none">
<div class="rongcloud-sprite"></div>
<span>连接断开,请刷新重连</span>
</div>
<div class="rcs-conversation-list">
{%this.conversationList%}
<!-- <div class="rcs-conversation-item"></div> -->
</div>
</div>
</div>{%}%}
<div class="rcs-chat-wrapper"></div>
</div>
\ No newline at end of file
... ...
<!-- message: 消息list的页面 -->
<div class="rong-message-list">
{%if(this.firstEnter){%}<div class="rongcloud-Messages-history" style="display: none;"><b onclick="RCS.loadHisMessages()">查看历史消息</b></div>{%}else if(this.hasMore){%}<div class="rongcloud-Messages-history"><b onclick="RCS.loadHisMessages()">查看历史消息</b></div>{%}%}{%else{%}<div class="rongcloud-Messages-history"><b>没有更多消息</b></div>{%}%}
{%for(var index in this.list){%}{%switch(this.list[index].messageType){%}{%case 'TextMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%}{%this.list[index].content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-text">
<pre class="rongcloud-Message-entry">{%this.list[index].content.content%}</pre>
</div>
</div>
</div>{%break;%}
{%case 'ImageMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%}{%this.list[index].content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-img">
<span class="rongcloud-Message-entry">
<a onclick="RCS.viewImage(event)" class="cursor-pointer" data-img="{%this.list[index].content.imageUri%}">
<img src="{%this.list[index].content.imageUri%}" data-img="{%this.list[index].content.imageUri%}">
</a>
</span>
</div>
</div>
</div>{%break;%}
{%case 'FileMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user){%}{%this.list[index].content.user.name%}{%}else{%} {%'客服'%} {%}%} {%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-file">
<div class="rongcloud-sprite rongcloud-file-icon"></div>
<div class="rongcloud-file-name">{%this.list[index].content.name%}</div>
<div class="rongcloud-file-size">{%this.list[index].content.size%}</div>
<a class="rongcloud-sprite rongcloud-file-download" href="{%this.list[index].content.fileUrl%}" download="{%this.list[index].content.name%}"></a>
</div>
</div>
</div>{%break;%}
{%case 'VoiceMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%}{%this.list[index].content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-audio">
<span class="rongcloud-Message-entry">
{%if(this.messageDirection == 1){%}
<div style="display:inline-block;">
<span class="rongcloud-audioTimer">{%Math.ceil(this.list[index].content.duration || this.list[index].content.duration / 1024)%}''</span>
</div>
<span class="rongcloud-r-audioBox rongcloud-clearfix" onclick='RCS.play(event, {%JSON.stringify(this.list[index].content)%})'>
<i></i><i></i><i></i>
</span>
{%}else{%}
<span class="rongcloud-audioBox rongcloud-clearfix" onclick='RCS.play(event, {%JSON.stringify(this.list[index].content)%})'>
<i></i><i></i><i></i>
</span>
<div style="display:inline-block;">
<span class="rongcloud-audioTimer">{%Math.ceil(this.list[index].content.duration || this.list[index].content.duration / 1024)%}''</span>
</div>
{%}%}
</span>
</div>
</div>
</div>{%break;%}
{%case 'TimeMessage':%}
<div class="rongcloud-Messages-date">
<b>{%this.list[index].sentTime%}</b>
</div>{%break;%}
{%case 'InformationNotificationMessage':%}
<div class="rongcloud-sys-tips">
<span>{%this.list[index].content.message%}</span>
</div>{%break;%}
{%case 'AlertMessage':%}
<div class="rongcloud-sys-tips">
<span>{%this.list[index].content.content%}</span>
</div>{%break;%}
{%case 'SightMessage': %}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%}{%this.list[index].content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-sight" onclick="RCS.playVideo(event)">
<video poster="{% 'data:image/jpg;base64,' + this.list[index].content.content %}" src="{% this.list[index].content.sightUrl %}"></video>
<div class="play-btn"></div>
</div>
</div>
</div>
{%break;%}
{%default: %}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.list[index].messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.list[index].messageDirection != 1){%} {%if(this.list[index].content.user.icon){%}{%this.list[index].content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.list[index].messageDirection != 1){%}{%this.list[index].content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-text">
<pre class="rongcloud-Message-entry">当前版本暂不支持查看此消息</pre>
</div>
</div>
</div>{%}%}{%}%}
</div>
<!-- <div class="rongcloud-emptyBox">暂时没有新消息</div> -->
\ No newline at end of file
... ...
<!-- messageTemplate: 一个消息的页面 -->
<!-- class="rongcloud-audioState"声音消息播放状态
class="rongcloud-audioBox" 声音消息容器
此类名不能被修改 -->
{%switch(this.messageType){%}{%case 'TextMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-text">
<pre class="rongcloud-Message-entry">{%this.content.content%}</pre>
</div>
</div>
</div>{%break;%}
{%case 'ImageMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-img">
<span class="rongcloud-Message-entry">
<a onclick="RCS.viewImage(event)" class="cursor-pointer" data-img="{%this.content.imageUri%}">
<img src="{%this.content.imageUri%}" onload="RCS.scrollBottom()" data-img="{%this.content.imageUri%}">
</a>
</span>
</div>
</div>
</div>{%break;%}
{%case 'FileMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-file">
<div class="rongcloud-sprite rongcloud-file-icon"></div>
<div class="rongcloud-file-name">{%this.content.name%}</div>
<div class="rongcloud-file-size">{%this.content.size%}</div>
<a class="rongcloud-sprite rongcloud-file-download" href="{%this.content.fileUrl%}" download="{%this.content.name%}"></a>
</div>
</div>
</div>{%break;%}
{%case 'VoiceMessage':%}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-audio">
<span class="rongcloud-Message-entry">
{%if(this.messageDirection == 1){%}
<div style="display:inline-block;">
<span class="rongcloud-audioTimer">{%Math.ceil(this.content.duration || this.content.duration.length / 1024)%}''</span>
</div>
<span class="rongcloud-r-audioBox rongcloud-clearfix" onclick='RCS.play(event, {%JSON.stringify(this.content)%})'>
<i></i><i></i><i></i>
</span>
{%}else{%}
<span class="rongcloud-audioBox rongcloud-clearfix" onclick='RCS.play(event, {%JSON.stringify(this.content)%})'>
<i></i><i></i><i></i>
</span>
<div style="display:inline-block;">
<span class="rongcloud-audioTimer">{%Math.ceil(this.content.duration || this.content.duration.length / 1024)%}''</span>
<span class="rongcloud-audioState"></span>
</div>
{%}%}
</span>
</div>
</div>
</div>{%break;%}
{%case 'TimeMessage':%}
<div class="rongcloud-Messages-date">
<b>{%this.sentTime%}</b>
</div>{%break;%}
{%case 'InformationNotificationMessage':%}
<div class="rongcloud-sys-tips">
<span>{%this.content.message%}</span>
</div>{%break;%}
{%case 'AlertMessage':%}
<div class="rongcloud-sys-tips">
<span>{%this.content.content%}</span>
</div>{%break;%}
{%case 'SightMessage': %}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-sight" onclick="RCS.playVideo(event)">
<video poster="{% 'data:image/jpg;base64,' + this.content.content %}" src="{% this.content.sightUrl %}"></video>
<div class="play-btn"></div>
</div>
</div>
</div>
{%break;%}
{%default: %}
<div class="rongcloud-Message rongcloud-clearfix {%if(this.messageDirection == 1){%} {%'rongcloud-Message-send'%} {%}%}" id="rcs-templte-message-text">
<div>
<div class="rongcloud-Message-header"><img class="rongcloud-img rongcloud-Message-avatar rongcloud-avatar" src="{%if(this.messageDirection != 1){%} {%if(this.content.user.icon){%}{%this.content.user.icon%}{%}else{%} {%RCS.config.csIcon%} {%}%} {%}else{%} {%RCS.config.userIcon%} {%}%}" alt="">
<div class="rongcloud-Message-author rongcloud-clearfix">
<a class="rongcloud-author">{%if(this.messageDirection != 1){%}{%this.content.user.name%}{%}else{%} {%'我'%} {%}%}</a>
</div>
</div>
</div>
<div class="rongcloud-Message-body">
<div class="rongcloud-Message-text">
<pre class="rongcloud-Message-entry">当前版本暂不支持查看此消息</pre>
</div>
</div>
</div>{%}%}
... ...
<!-- userInfo: 收集用户信息的页面
class="userInfoModel"收集用户信息页面容器
此类名不能被修改
-->
<div class="rongcloud-layermbox userInfoModel">
<div class="rongcloud-laymshade"></div>
<div class="rongcloud-layermmain">
<div class="rongcloud-section">
<div class="rongcloud-layermchild rongcloud-collectuserinfo">
<form name='userinfo' novalidate="true">
<div class="rongcloud-layer-body">
<div class="rongcloud-collectuserinfo-title">你好,客服邀请您填写如下内容</div>
<a class="rongcloud-layer-close" onclick="RCS.userInfoClose()">×</a>
{%for(var index in this.list){%}
<div class="rongcloud-form-item">
<label class="rongcloud-form-label {%if(this.list[index].required == 1){%}{%'rongcloud-require'%}{%}%}">{%this.list[index].label%}:</label>
{%switch(this.list[index].type){%}{%case 'input':%}
<input class="rongcloud-inputtext" type="text" name="{%this.list[index].name%}" data-label="{%this.list[index].label%}" data-pattern="{%this.list[index].rule%}" placeholder="{%this.list[index].defaultText%}" onblur="RCS.validateUserInfo(event)" {%if(this.list[index].required == 1){%}{%'data-required = required'%}{%}%}></input>{%break;%}{%case 'textarea':%}
<textarea name="{%this.list[index].name%}" placeholder="{%this.list[index].defaultText%}" data-label="{%this.list[index].label%}" data-pattern="{%this.list[index].rule%}" onblur="RCS.validateUserInfo(event)"></textarea>{%break;%}{%}%}
<div class="rongcloud-form-error" style="display: none;"></div>
</div>{%}%}
</div>
<div class="rongcloud-foot">
<button class="rongcloud-btn" onclick="RCS.userInfoConfirm(event)">提交</button>
</div>
</form>
</div>
</div>
</div>
</div>
\ No newline at end of file
... ...