001360截图20180915003708059.png (23.89 KB, 下载次数: 530)
下载附件 保存到相册
6 年前 上传
002360截图20180915003826602.png (22.63 KB, 下载次数: 539)
003360截图20180915005347716.png (45.81 KB, 下载次数: 550)
004360截图20180915005419923.png (48.47 KB, 下载次数: 548)
006360截图20180915005901996.png (46.76 KB, 下载次数: 509)
007360截图20180915010048485.png (35.98 KB, 下载次数: 537)
008360截图20180915010335077.png (59.24 KB, 下载次数: 557)
010360截图20180915013242999.png (114.29 KB, 下载次数: 564)
011360截图20180915013303062.png (72.13 KB, 下载次数: 526)
012360截图20180915010948002.png (72.52 KB, 下载次数: 539)
013360截图20180915011004813.png (73.47 KB, 下载次数: 504)
014360截图20180915011140916.png (54.71 KB, 下载次数: 529)
015360截图20180915011705229.png (80.31 KB, 下载次数: 513)
017360截图20180915011927963.png (20.09 KB, 下载次数: 530)
018360截图20180915012046733.png (28.94 KB, 下载次数: 524)
019360截图20180915012132931.png (28.84 KB, 下载次数: 499)
var $chatMsgList = $("#J__chatMsgList"); // ...处理编辑器信息 var $editor = $(".J__wdtEditor"), _editor = $editor[0]; function surrounds() { setTimeout(function () { //chrome var sel = window.getSelection(); var anchorNode = sel.anchorNode; if (!anchorNode) return; if (sel.anchorNode === _editor || (sel.anchorNode.nodeType === 3 && sel.anchorNode.parentNode === _editor)) { var range = sel.getRangeAt(0); var p = document.createElement("p"); range.surroundContents(p); range.selectNodeContents(p); range.insertNode(document.createElement("br")); //chrome sel.collapse(p, 0); (function clearBr() { var elems = [].slice.call(_editor.children); for (var i = 0, len = elems.length; i < len; i++) { var el = elems[i]; if (el.tagName.toLowerCase() == "br") { _editor.removeChild(el); } } elems.length = 0; })(); } }, 10); } // 定义光标位置 var _lastRange = null, _sel = window.getSelection && window.getSelection(); var _rng = { getRange: function () { if (_sel && _sel.rangeCount > 0) { return _sel.getRangeAt(0); } }, addRange: function () { if (_lastRange) { _sel.removeAllRanges(); _sel.addRange(_lastRange); } } } // 格式编辑器包含标签 _editor.addEventListener("click", function () { $(".wdt__choose-panel").hide(); }, true); _editor.addEventListener("focus", function () { surrounds(); }, true); _editor.addEventListener("input", function () { surrounds(); }, false); // ...选择文件 $("#J__chooseFile").on("change", function () { $(".wdt__choose-panel").hide(); var file = this.files[0], fileSuffix = /\.[^\*]+/.exec(file.name).toString(), fileExt = fileSuffix.substr(fileSuffix.lastIndexOf('.') + 1, fileSuffix.length).toLowerCase(); console.log(fileSuffix); console.log(fileExt); var fileTypeArr = ['jpg', 'jpeg', 'png', 'gif', 'txt', 'rar', 'zip', 'pdf', 'docx', 'xls']; if ($.inArray(fileExt, fileTypeArr) < 0) { wcPop({content: '附件只支持jpg、jpeg、png、gif、txt、rar、zip、pdf、docx、xls格式的文件', time: 2}); return; } var reader = new FileReader(); reader.readAsDataURL(file); reader.onload = function (e) { var _file = this.result; console.log(_file); var _tpl = [ '<li class= "me">\ <div class="content">\ <p class="author">风铃子</p>\ <div class="msg attachment">\ <div class="card flexbox flex-alignc">\ <span class="ico-bg wdt__bg01"><i class="iconfont icon-fujian"></i></span>\ <div class="file-info flex1" title="'+ file.name +'">\ <p class="name">'+ file.name +'</p><p class="size">'+ formateSize(file.size) +'</p>\ </div>\ <a class="btn-down" href="'+ _file +'" target="_blank" download="'+ file.name +'"><i class="iconfont icon-down"></i></a>\ </div>\ </div>\ </div>\ <a class="avatar" href="微钉-好友主页(详细资料).html"><img src="img/uimg/u__chat-img07.jpg" /></a>\ </li>' ].join(""); $chatMsgList.append(_tpl); setTimeout(function () {wchat_ToBottom();}, 17); } /** 格式化文件大小显示 value : file文件的大小值 */ formateSize = function (value) { if (null == value || value == '') { return "0 Bytes"; } var unitArr = new Array("B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"); var index = 0; var srcsize = parseFloat(value); index = Math.floor(Math.log(srcsize) / Math.log(1024)); var size = srcsize / Math.pow(1024, index); size = size.toFixed(2); //保留的小数位数 return size + unitArr[index]; } }); // ...拆开红包功能 $(".J__getRedPackets").on("click", function(){ var getHbIdx = wcPop({ id: 'wdtPopGetHb', skin: 'ios', content: $("#J__popupTmpl-getRedPacket").html(), xclose: true, style: 'background-color: #f3f3f3; width: 280px;', show: function () { $("body").on("click", ".J__btnGetRedPacket", function () { var that = $(this); that.addClass("active"); setTimeout(function(){ that.removeClass("active"); }, 1000); }); } }); });
/* __ 触摸模拟(active) */ .wdt__material-cell:active{background-color: rgba(25,31,37,.1)!important; transition: all .3s;} /* __ 模拟水波效果 */ .wdt__ripple, .wdt__ripple-fff{overflow: hidden; position: relative;} .wdt__ripple:before, .wdt__ripple-fff:before{ background-image: radial-gradient(circle, #191f25 10%, transparent 11%); background-repeat: no-repeat; background-position: center; content: ''; display: block; pointer-events: none; opacity: 0; height: 100%; width: 100%; position: absolute; left: 0; top: 0; transform: scale(8,8); transition: transform .5s, opacity 1s; } .wdt__ripple-fff:before{background-image: radial-gradient(circle, #fff 10%, transparent 11%);} .wdt__ripple:active:before, .wdt__ripple-fff:active:before{opacity: .1; transform: scale(0,0); transition: 0s;} .wdt__ripple.disabled, .wdt__ripple-fff.disabled{pointer-events: none;} /* …… 微钉主布局——首页.layout …… */ .weDingTalk__panel{-webkit-touch-callout:none; -webkit-user-select:none; -moz-user-select:none; user-select:none; -webkit-tap-highlight-color: transparent; transition: transform .3s;} .we__dingtalk-wrapper{height: calc(100vh); position: relative;} .wdt__container{overflow-y: auto; -webkit-overflow-scrolling: touch; width: 100%; position: relative;} /* —— 顶部header */ .wdt__topBar .inner{/*background-image: linear-gradient(90deg,#3296fa 10%,#00d3f3);*/ background: #fff; height:1rem; width:100%; z-index:999; position:relative;} .wdt__topBar.topfixed{padding-bottom:1rem;} .wdt__topBar.topfixed .inner{max-width:750px; width:100%; position:fixed; top:0;} .wdt__topBar .inner .barTit{color:#191f25; font-size:.36rem; font-family: 'Microsoft Yahei'; margin-top: -.03rem; padding-left: .25rem; position: relative;} .wdt__topBar .inner .barTit.sm{color: #575b60; font-size: .32rem; padding-left: 0;} .wdt__topBar .inner .barTxt{color: #191f25; font-size: .32rem; justify-content: center; align-items: center;} .wdt__topBar .inner .barTxt .lbl{color: #9ea0a3; display: block; font-size: .2rem;} /* —— 1、消息模块 */ /* 消息记录列表 */ .wdt__recordList ul li{background: #fff; font-family: 'Microsoft Yahei'; padding: .2rem .25rem; position: relative;} .wdt__recordList ul li:after{content: ''; background-color: #dcdddd; color: #dcdddd; opacity: .56; height: 1px;width: 100%; position: absolute;left: 0;bottom: 0; transform: scaleY(.5); -webkit-transform: scaleY(.5);} .wdt__recordList ul li:last-child:after{display: none;} .wdt__recordList ul li .avator{margin-right: .25rem; border-radius: 50%; overflow: hidden; height: .9rem; width: .9rem; position: relative;} .wdt__recordList ul li .avator img{border-radius: 50%; height: 100%; width: 100%; object-fit: cover; position: absolute;} .wdt__recordList ul li .groups{background: #dcdddd;}
20180817002157557.jpg (9.81 KB, 下载次数: 541)
来源:即时通讯网 - 即时通讯开发者社区!
轻量级开源移动端即时通讯框架。
快速入门 / 性能 / 指南 / 提问
轻量级Web端即时通讯框架。
详细介绍 / 精编源码 / 手册教程
移动端实时音视频框架。
详细介绍 / 性能测试 / 安装体验
基于MobileIMSDK的移动IM系统。
详细介绍 / 产品截图 / 安装体验
一套产品级Web端IM系统。
详细介绍 / 产品截图 / 演示视频
引用此评论
Copyright © 2014-2024 即时通讯网 - 即时通讯开发者社区 / 版本 V4.4
苏州网际时代信息科技有限公司 (苏ICP备16005070号-1)
Processed in 0.178718 second(s), 32 queries , Gzip On.