function.js 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496
  1. //菜单点击监听事件
  2. function clickItem(obj){
  3. if($(obj).hasClass("layui-nav-itemed")){
  4. $.each($(".layui-nav-item"), (index, item) => {
  5. $(item).find("a cite img").attr("src", "/images/indeHome/" + $(item).attr("titleVal") + ".png");
  6. });
  7. $(obj).find("a cite img").attr("src", "/images/indeHome/" + $(obj).attr("titleVal") + "_click.png");
  8. //个人信息特殊处理
  9. if($(obj).find("a cite").attr("name") == "账户信息"){
  10. $(".layui-nav-child dd").removeClass("layui-this");
  11. iframeClick(obj);
  12. }else if($(obj).find("a cite").attr("name") == "路线发布"){//路线发布特殊处理
  13. $(".layui-nav-child dd").removeClass("layui-this");
  14. iframeClick(obj);
  15. }
  16. }else{
  17. $(obj).find("a cite img").attr("src", "/images/indeHome/" + $(obj).attr("titleVal") + ".png");
  18. }
  19. }
  20. //iframe选择
  21. function iframeClick(obj){
  22. //上一级名称
  23. var parentName = $(obj).parent().parent().prev().find("cite").attr("name");
  24. //点击名称
  25. var thisClickName = $(obj).find("cite").attr("name");
  26. //点击名称防止翻译无效
  27. var thisName = $(obj).find("cite").text();
  28. //路径上参数
  29. var idVal = $(obj).attr("idVal");
  30. //翻译字段
  31. var locale = $(obj).attr("locale");
  32. $(".select_button").removeClass("check_div");
  33. var flag = false;
  34. $.each($(".select_button"), (index, item) => {
  35. if(index > 0){
  36. if($(item).attr("name").indexOf(thisClickName) != -1) {
  37. flag = true;
  38. return false;
  39. }
  40. }
  41. });
  42. if(flag){
  43. $(".center_top div[name="+ thisClickName +"]").click();
  44. } else {
  45. if(parentName == "报价单"){
  46. $(".center_top").append("<div onClick='switchMenu(this)' name="+ thisClickName +" src='/page/demandForSingleIndex?idVal="+ idVal +"' class=\"select_button check_div\">\n" +
  47. " <span data-locale=\""+ locale +"\">"+ thisName +"</span>\n" +
  48. " <div class=\"close_button\" onclick='removeThis(this)'><i class=\"layui-icon layui-icon-close\"></i></div>\n" +
  49. " </div>");
  50. $("iframe").attr("src", "/page/demandForSingleIndex?idVal=" + idVal);
  51. }
  52. if(thisClickName == "账户信息"){
  53. $(".center_top").append("<div onClick='switchMenu(this)' name='账户信息' src='/page/personalIndex' class=\"select_button check_div\">\n" +
  54. " <span data-locale=\""+ locale +"\">"+ thisName +"</span>\n" +
  55. " <div class=\"close_button\" onclick='removeThis(this)'><i class=\"layui-icon layui-icon-close\"></i></div>\n" +
  56. " </div>");
  57. $("iframe").attr("src", "/page/personalIndex");
  58. }
  59. if(thisClickName == "路线发布"){
  60. $(".center_top").append("<div onClick='switchMenu(this)' name='路线发布' src='/page/releaseIndex' class=\"select_button check_div\">\n" +
  61. " <span data-locale=\""+ locale +"\">"+ thisName +"</span>\n" +
  62. " <div class=\"close_button\" onclick='removeThis(this)'><i class=\"layui-icon layui-icon-close\"></i></div>\n" +
  63. " </div>");
  64. $("iframe").attr("src", "/page/releaseIndex");
  65. }
  66. if(parentName == "退款申请"){
  67. $(".center_top").append("<div onClick='switchMenu(this)' name="+ thisClickName +" src='/page/refundIndex?idVal="+ idVal +"' class=\"select_button check_div\">\n" +
  68. " <span data-locale=\""+ locale +"\">"+ thisName +"</span>\n" +
  69. " <div class=\"close_button\" onclick='removeThis(this)'><i class=\"layui-icon layui-icon-close\"></i></div>\n" +
  70. " </div>");
  71. $("iframe").attr("src", "/page/refundIndex?idVal=" + idVal);
  72. }
  73. }
  74. }
  75. //头部菜单切换
  76. function switchMenu(obj){
  77. $(".select_button").removeClass("check_div");
  78. $(obj).addClass("check_div")
  79. var srcVal = $(obj).attr("src");
  80. $("iframe").attr("src", srcVal);
  81. }
  82. //删除顶部选中菜单
  83. function removeThis(obj){
  84. window.event.cancelBubble = true;//阻止冒泡
  85. var name = $(obj).parent().attr("name");//当前模块名称
  86. var prevName = $(obj).parent().prev().attr("name");//上一个模块名称
  87. if(prevName == "首页"){
  88. $(obj).parent().prev().click();
  89. }
  90. // $(".iframe_div").find("iframe").attr("src", "");
  91. $(obj).parent().remove();
  92. $.each($(".layui-nav-tree li"), function(index, item){
  93. //自动关闭第一级
  94. let eleName = $(item).attr("name");
  95. //点击上一个模块
  96. if(eleName == prevName){
  97. $(item).click();
  98. }
  99. if(eleName == name){
  100. //删除选中状态
  101. $(item).removeClass("layui-nav-itemed");
  102. $(item).find("cite img").attr("src", "/images/indeHome/" + $(item).attr("title") + ".png");
  103. return false;
  104. }
  105. //如果不是第一级那进入第二级
  106. $.each($(item).find("dl dd"), (index, ele) => {
  107. let eleVal = $(ele).find("cite").html();
  108. //点击上一个模块
  109. if(eleVal == prevName){
  110. $(ele).find("a").click();
  111. }
  112. //删除选中状态
  113. if(eleVal == name){
  114. $(ele).removeClass("layui-this");
  115. return false;
  116. }
  117. });
  118. });
  119. }
  120. //聊天显示
  121. var clickMessageType = false;
  122. function messageShow(){
  123. countSum = 0;//消息数量;
  124. $(".message_num").html(countSum);
  125. $(".message_num").hide();
  126. clickMessageType = true;
  127. layer.open({
  128. type: 1,
  129. title: false,
  130. offset: ["1366px","auto"],
  131. closeBtn: 2,
  132. anim: 2,
  133. shadeClose: true,
  134. content: $(".van-popup"),
  135. end: () => {
  136. clickMessageType = false;
  137. }
  138. })
  139. var height = $(".right_el_scrollbar")[0].scrollHeight;
  140. $(".chat__room-content-scroll .el-scrollbar__wrap").scrollTop(height);
  141. }
  142. //注册并登录环信账号
  143. function registerUser(){
  144. var options = {
  145. username: username.toLowerCase(),
  146. password: '123456',
  147. nickname: nickname,
  148. appKey: WebIM.config.appkey,
  149. success: function () { },
  150. error: function (err) {
  151. let errorData = JSON.parse(err.data);
  152. },
  153. };
  154. conn.registerUser(options);
  155. var options1 = {
  156. user: username.toLowerCase(),
  157. pwd: '123456',
  158. appKey: WebIM.config.appkey
  159. };
  160. conn.open(options1);
  161. //
  162. setTimeout(function (){
  163. let options = {
  164. nickname: nickname,
  165. avatarurl: headImg,
  166. }
  167. //修改用户信息
  168. conn.updateOwnUserInfo(options);
  169. //查询列表
  170. conn.getSessionList().then((res) => {
  171. $(".left_el_scrollbar div").remove();//删除所有记录重新渲染
  172. $.each(res.data.channel_infos, (index, item) => {
  173. var dataVal = JSON.parse(item.meta.payload);//最新消息
  174. var time = item.meta.timestamp;//发送消息时间戳
  175. var timeVal;//时间选择 如果大于当前时间则显示yyyy-mm-dd 如果相等显示mm:ss
  176. var userMap = {};
  177. var fromTo = dataVal.from;
  178. if(dataVal.from == username.toLowerCase()){
  179. fromTo = dataVal.to;
  180. }
  181. conn.fetchUserInfoById([fromTo], ['nickname', 'avatarurl']).then((res) => {
  182. $.each(res.data, (index, itemVal) => {
  183. userMap.nickname = itemVal.nickname;
  184. userMap.avatarurl = itemVal.avatarurl;
  185. });
  186. if(format(time).split("|")[0] == format(Date.parse(new Date())).split("|")[0]){
  187. timeVal = format(time).split("|")[1]
  188. } else {
  189. timeVal = format(time).split("|")[0]
  190. }
  191. //判断是图片还是文字
  192. if(dataVal.bodies[0].type == "txt"){
  193. $(".left_el_scrollbar").append("<div id='"+ fromTo +"' name='"+ userMap.nickname +"' onclick='clickMessage(this)' class=\"chat__room-session-item\"><img\n" +
  194. " src=\""+ userMap.avatarurl +"\"\n" +
  195. " alt=\""+ userMap.nickname +"头像\"><span class=\"chat__room-session-item-unread\"\n" +
  196. " style=\"display: none;\">0</span>\n" +
  197. " <div class=\"chat__room-user\"><p class=\"chat__room-user-title\"><span\n" +
  198. " title=\""+ userMap.nickname +"\">"+ userMap.nickname +"</span><span>"+ timeVal +"</span></p>\n" +
  199. " <p title=\""+ dataVal.bodies[0].msg +"\">"+ dataVal.bodies[0].msg +"</p></div>\n" +
  200. " </div>");
  201. } else {
  202. $(".left_el_scrollbar").append("<div id='"+ fromTo +"' name='"+ userMap.nickname +"' onclick='clickMessage(this)' class=\"chat__room-session-item\"><img\n" +
  203. " src=\""+ userMap.avatarurl +"\"\n" +
  204. " alt=\""+ userMap.nickname +"头像\"><span class=\"chat__room-session-item-unread\"\n" +
  205. " style=\"display: none;\">0</span>\n" +
  206. " <div class=\"chat__room-user\"><p class=\"chat__room-user-title\"><span\n" +
  207. " title=\""+ userMap.nickname +"\">"+ userMap.nickname +"</span><span>"+ timeVal +"</span></p>\n" +
  208. " <p title=\"[图片]\">[图片]</p></div>\n" +
  209. " </div>");
  210. }
  211. });
  212. });
  213. })
  214. },2000);
  215. }
  216. // 单聊发送文本消息
  217. function sendPrivateText(textVal) {
  218. if(userID == null){
  219. layer.msg("暂未选择聊天对象", {icon: 2});
  220. return false;
  221. }
  222. let id = conn.getUniqueId(); // 生成本地消息id
  223. let msg = new WebIM.message('txt', id); // 创建文本消息
  224. msg.set({
  225. msg: textVal, // 消息内容
  226. to: userID, // 接收消息对象(用户id)
  227. chatType: 'singleChat', // 设置为单聊
  228. success: function (id, serverMsgId) {
  229. $(".right_el_scrollbar").append("<div class=\"chat__room-message chat__room-message-reverse\"\n" +
  230. " cid=\""+ id +"\"><img\n" +
  231. " src=\""+ headImg +"\"\n" +
  232. " alt=\"avatar\" class=\"avatar\">\n" +
  233. " <div class=\"chat__room-message-text\">\n" +
  234. " <div class=\"chat__room-message-text-info\"><!----><!---->\n" +
  235. " <div class=\"chat__room-message-text-wrapper\"><p>"+ textVal +"</p>\n" +
  236. " <p style=\"display: none;\"></p><i class=\"arrow\"></i></div>\n" +
  237. " </div>\n" +
  238. " <span>"+ formatNotss(Date.parse(new Date())) +"</span></div><!----></div>")
  239. var height = $(".right_el_scrollbar")[0].scrollHeight;
  240. $("#" + userID).find(".chat__room-user p").eq(1).html(textVal);
  241. $("#" + userID).find(".chat__room-user p").eq(1).attr("title", textVal);
  242. $("#" + userID).find(".chat__room-user-title span").eq(1).html(formatNotss(Date.parse(new Date())).split(" ")[1].substring(0, 5));
  243. $(".chat__room-content-scroll .el-scrollbar__wrap").scrollTop(height);
  244. },
  245. fail: function(e){
  246. console.log("失败");
  247. }
  248. });
  249. conn.send(msg.body);
  250. $(".chat__room-info-input textarea").val("");
  251. }
  252. //消息切换
  253. function clickMessage(obj){
  254. var id = $(obj).attr("id");
  255. console.log(id)
  256. var name = $(obj).attr("name");
  257. avatarUrlParty = $(obj).find("img").attr("src");
  258. userID = id;
  259. $(".chat__room-info-title h4").html(name);
  260. $(".right_el_scrollbar div").remove();
  261. $(obj).find(".chat__room-session-item-unread").html(0);
  262. $(obj).find(".chat__room-session-item-unread").hide();
  263. conn.mr_cache = [];
  264. var options = {
  265. queue: id, //需特别注意queue属性值为大小写字母混合,以及纯大写字母,会导致拉取漫游为空数组,因此注意将属性值装换为纯小写
  266. isGroup: false,
  267. count: 10,
  268. success: function(res){
  269. //获取拉取成功的历史消息
  270. $.each(res, (index, item) => {
  271. var time = item.time;
  272. if(item.from != username.toLowerCase()){
  273. messageLoad(item, avatarUrlParty, time);
  274. } else {
  275. messageLoad(item, headImg, time);
  276. }
  277. var height = $(".right_el_scrollbar")[0].scrollHeight;
  278. $(".chat__room-content-scroll .el-scrollbar__wrap").scrollTop(height);
  279. });
  280. },
  281. fail: function(){}
  282. }
  283. conn.fetchHistoryMessages(options);
  284. var height = $(".right_el_scrollbar")[0].scrollHeight;
  285. $(".right_el_scrollbar").scrollTop(height);
  286. }
  287. //全屏预览图片
  288. function clickImg(obj){
  289. var imgUrl = $(obj).attr("src");
  290. layer.open({
  291. type: 1,
  292. title: false,
  293. area: ['80%', '80%'],
  294. closeBtn: 2,
  295. anim: 2,
  296. content: "<img src='"+ imgUrl +"' width='100%' height='100%'/>"
  297. })
  298. }
  299. //消息渲染
  300. function messageLoad(item, img, time){
  301. if(item.contentsType == "TEXT"){
  302. //判断是否是自己的消息
  303. if(item.from == username.toLowerCase()){
  304. $(".right_el_scrollbar").append("<div class=\"chat__room-message chat__room-message-reverse\"\n" +
  305. " cid=\""+ item.id +"\"><img\n" +
  306. " src=\""+ img +"\"\n" +
  307. " alt=\"avatar\" class=\"avatar\">\n" +
  308. " <div class=\"chat__room-message-text\">\n" +
  309. " <div class=\"chat__room-message-text-info\"><!----><!---->\n" +
  310. " <div class=\"chat__room-message-text-wrapper\"><p>"+ item.data +"</p>\n" +
  311. " <p style=\"display: none;\"></p><i class=\"arrow\"></i></div>\n" +
  312. " </div>\n" +
  313. " <span>"+ formatNotss(parseInt(time)) +"</span></div><!----></div>")
  314. } else {
  315. $(".right_el_scrollbar").append("<div class=\"chat__room-message\"\n" +
  316. " cid=\""+ item.id +"\"><img\n" +
  317. " src=\""+ img +"\"\n" +
  318. " alt=\"avatar\" class=\"avatar\">\n" +
  319. " <div class=\"chat__room-message-text\">\n" +
  320. " <div class=\"chat__room-message-text-info\"><!----><!---->\n" +
  321. " <div class=\"chat__room-message-text-wrapper\"><p>"+ item.data +"</p>\n" +
  322. " <p style=\"display: none;\"></p><i class=\"arrow\"></i></div>\n" +
  323. " </div>\n" +
  324. " <span>"+ formatNotss(parseInt(time)) +"</span></div><!----></div>")
  325. }
  326. } else {
  327. //判断是否是自己的消息
  328. if(item.from == username.toLowerCase()){
  329. $(".right_el_scrollbar").append("<div class=\"chat__room-message chat__room-message-reverse\"\n" +
  330. " ><img\n" +
  331. " src=\""+ img +"\"\n" +
  332. " alt=\"avatar\" class=\"avatar\"><!---->\n" +
  333. " <div class=\"chat__room-message-img\">\n" +
  334. " <div class=\"el-image\"><img onclick='clickImg(this)' alt=\"fileImage\"\n" +
  335. " src=\""+ item.url +"\"\n" +
  336. " class=\"el-image__inner el-image__preview\"\n" +
  337. " style=\"object-fit: cover;\"><!--v-if--></div>\n" +
  338. " <span>"+ formatNotss(parseInt(time)) +"</span></div>\n" +
  339. " </div>")
  340. } else {
  341. $(".right_el_scrollbar").append("<div class=\"chat__room-message\"\n" +
  342. " ><img\n" +
  343. " src=\""+ img +"\"\n" +
  344. " alt=\"avatar\" class=\"avatar\"><!---->\n" +
  345. " <div class=\"chat__room-message-img\">\n" +
  346. " <div class=\"el-image\"><img onclick='clickImg(this)' alt=\"fileImage\"\n" +
  347. " src=\""+ item.url +"\"\n" +
  348. " class=\"el-image__inner el-image__preview\"\n" +
  349. " style=\"object-fit: cover;\"><!--v-if--></div>\n" +
  350. " <span>"+ formatNotss(parseInt(time)) +"</span></div>\n" +
  351. " </div>")
  352. }
  353. }
  354. }
  355. function messageLoadOld(item, img, time){
  356. if(item.contentsType == "TEXT"){
  357. //判断是否是自己的消息
  358. if(item.from == username.toLowerCase()){
  359. $(".right_el_scrollbar .char__room-content-menu").after("<div class=\"chat__room-message chat__room-message-reverse\"\n" +
  360. " cid=\""+ item.id +"\"><img\n" +
  361. " src=\""+ img +"\"\n" +
  362. " alt=\"avatar\" class=\"avatar\">\n" +
  363. " <div class=\"chat__room-message-text\">\n" +
  364. " <div class=\"chat__room-message-text-info\"><!----><!---->\n" +
  365. " <div class=\"chat__room-message-text-wrapper\"><p>"+ item.data +"</p>\n" +
  366. " <p style=\"display: none;\"></p><i class=\"arrow\"></i></div>\n" +
  367. " </div>\n" +
  368. " <span>"+ formatNotss(parseInt(time)) +"</span></div><!----></div>")
  369. } else {
  370. $(".right_el_scrollbar .char__room-content-menu").after("<div class=\"chat__room-message\"\n" +
  371. " cid=\""+ item.id +"\"><img\n" +
  372. " src=\""+ img +"\"\n" +
  373. " alt=\"avatar\" class=\"avatar\">\n" +
  374. " <div class=\"chat__room-message-text\">\n" +
  375. " <div class=\"chat__room-message-text-info\"><!----><!---->\n" +
  376. " <div class=\"chat__room-message-text-wrapper\"><p>"+ item.data +"</p>\n" +
  377. " <p style=\"display: none;\"></p><i class=\"arrow\"></i></div>\n" +
  378. " </div>\n" +
  379. " <span>"+ formatNotss(parseInt(time)) +"</span></div><!----></div>")
  380. }
  381. } else {
  382. //判断是否是自己的消息
  383. if(item.from == username.toLowerCase()){
  384. $(".right_el_scrollbar .char__room-content-menu").after("<div class=\"chat__room-message chat__room-message-reverse\"\n" +
  385. " ><img\n" +
  386. " src=\""+ img +"\"\n" +
  387. " alt=\"avatar\" class=\"avatar\"><!---->\n" +
  388. " <div class=\"chat__room-message-img\">\n" +
  389. " <div class=\"el-image\"><img onclick='clickImg(this)' alt=\"fileImage\"\n" +
  390. " src=\""+ item.url +"\"\n" +
  391. " class=\"el-image__inner el-image__preview\"\n" +
  392. " style=\"object-fit: cover;\"><!--v-if--></div>\n" +
  393. " <span>"+ formatNotss(parseInt(time)) +"</span></div>\n" +
  394. " </div>")
  395. } else {
  396. $(".right_el_scrollbar .char__room-content-menu").after("<div class=\"chat__room-message\"\n" +
  397. " ><img\n" +
  398. " src=\""+ img +"\"\n" +
  399. " alt=\"avatar\" class=\"avatar\"><!---->\n" +
  400. " <div class=\"chat__room-message-img\">\n" +
  401. " <div class=\"el-image\"><img onclick='clickImg(this)' alt=\"fileImage\"\n" +
  402. " src=\""+ item.url +"\"\n" +
  403. " class=\"el-image__inner el-image__preview\"\n" +
  404. " style=\"object-fit: cover;\"><!--v-if--></div>\n" +
  405. " <span>"+ formatNotss(parseInt(time)) +"</span></div>\n" +
  406. " </div>")
  407. }
  408. }
  409. }
  410. //翻译
  411. function translation(){
  412. }
  413. //复制
  414. function copyVal(){
  415. var value = clickEven.text().trim();
  416. var clipboard = new Clipboard('.copy_li', {
  417. text: function() {
  418. return value;
  419. }
  420. });
  421. clipboard.on('success', function(e) {
  422. // alert("复制成功");
  423. });
  424. clipboard.on('error', function(e) {
  425. // alert(e);
  426. });
  427. }
  428. //查询供应商内容
  429. function getSupplierUser(){
  430. $.ajax({
  431. url: "/personal/getPresonalMessage",
  432. type: "get",
  433. data: {},
  434. headers: {"token": localStorage.getItem("token")},
  435. dataType: "json",
  436. success: (data) => {
  437. if(data.msg == "200"){
  438. username = data.data.code;
  439. nickname = data.data.name;
  440. headImg = data.data.headpir;
  441. $(".head_portrait").attr("src", headImg);
  442. $(".user_font").html("Hi," + nickname);
  443. registerUser();//登录即时通讯
  444. }
  445. layer.closeAll("loading");
  446. },
  447. error: () => {
  448. layer.alert(paramReturn("服务器异常,请联系管理员", parent.type), {icon: 2});
  449. layer.closeAll("loading");
  450. }
  451. });
  452. }
  453. //聊天搜索框
  454. function getValue(obj){
  455. var sessionSearch = $(obj).val();
  456. $(".left_el_scrollbar .chat__room-session-item").hide().filter(":contains("+ sessionSearch.trim() +")").show();
  457. }
  458. //语言选择
  459. function languageSelese(obj){
  460. var name = $(obj).attr("name");
  461. var typeVal = $(obj).attr("type");
  462. type = typeVal;
  463. translationVal(typeVal);
  464. $(".iframe_div").find("iframe")[0].contentWindow.translationVal(typeVal)
  465. $(".language").find("p").html(name);
  466. }
  467. //头像悬浮
  468. function clickHeadHove(obj){
  469. var name = $(obj).text();
  470. if(name == "退出"){
  471. layer.confirm("确认退出吗?",{
  472. btn: ['确定', '取消'],
  473. title: false,
  474. skin: 'layclass'
  475. }, function () {
  476. localStorage.clear(); //清空缓存
  477. conn.close();
  478. window.location.href="/page/Login";
  479. },function (){
  480. layer.closeAll()
  481. })
  482. } else {
  483. $(".layui-nav-item").eq(3).addClass("layui-nav-itemed");
  484. $(".layui-nav-item").eq(3).click();
  485. }
  486. }