contrast.js 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826
  1. $(document).ready(function () {
  2. let url = window.location.search;
  3. let id;
  4. let data;
  5. let videoSrc;
  6. var theRequest = new Object();
  7. if (url.indexOf("?") != -1) {
  8. var str = url.substr(1);
  9. strs = str.split("&");
  10. for (var i = 0; i < strs.length; i++) {
  11. theRequest[strs[i].split("=")[0]] = unescape(
  12. decodeURI(strs[i].split("=")[1])
  13. );
  14. }
  15. }
  16. let tabId = theRequest.TabId || 1;
  17. // 上传文件-封面
  18. let inputFileFM = document.getElementById("uploadAddFM");
  19. let theFileFM;
  20. inputFileFM.onchange = function () {
  21. // 获取用户上传的文件对象
  22. theFileFM = inputFileFM.files[0];
  23. // 实例化一个文件读取器
  24. let fileReader = new FileReader();
  25. // 将用户上传的文件对象作为参数,传入文件读取器的方法readAsDateURL
  26. fileReader.readAsDataURL(theFileFM);
  27. // 文件读取器方法执行完毕后调用函数
  28. fileReader.onload = function () {
  29. $("#FMImg").attr("src", fileReader.result);
  30. };
  31. };
  32. // 上传文件-图片
  33. let tpFilesNum = 0;
  34. let tpFilesArr = [];
  35. let tpInputFile = document.getElementById("uploadAddTP");
  36. let tpTheFile;
  37. tpInputFile.onchange = function () {
  38. // 获取用户上传的文件对象
  39. tpTheFile = tpInputFile.files;
  40. //获取选择图片的个数
  41. let length = tpTheFile.length;
  42. // 回显
  43. for (let i = 0; i < length; i++) {
  44. // 实例化一个文件读取器
  45. let fileReader = new FileReader();
  46. fileReader.onload = function () {
  47. tpFilesNum++;
  48. let imgDataHtml = `<div class="HoutaiContainerDialogLine3ImgFile">
  49. <img class="HoutaiContainerDialogTPImg" src="${fileReader.result}" alt="">
  50. <div class="delImg btn" id="delImg${tpFilesNum}">删除</div>
  51. </div>`;
  52. $(".HoutaiContainerDialogLine3AddImg").before(imgDataHtml);
  53. tpFilesArr.push(tpTheFile[i]);
  54. console.log(tpFilesArr);
  55. // 功能-添加中删除-反差内容-视频
  56. $("#delImg" + tpFilesNum).on("click", function () {
  57. tpFilesArr.splice($(this).parent().index(), 1);
  58. console.log(tpFilesArr);
  59. $(this).parent().remove();
  60. });
  61. };
  62. //读取文件
  63. fileReader.readAsDataURL(tpTheFile[i]);
  64. }
  65. };
  66. // 上传文件-视频
  67. let spFilesNum = 0;
  68. let spFilesArr = [];
  69. let spInputFile = document.getElementById("uploadAddSP");
  70. let spTheFile;
  71. spInputFile.onchange = function () {
  72. // 获取用户上传的文件对象
  73. spTheFile = spInputFile.files;
  74. //获取选择图片的个数
  75. let length = spTheFile.length;
  76. // 回显
  77. for (let i = 0; i < length; i++) {
  78. // 实例化一个文件读取器
  79. let fileReader = new FileReader();
  80. fileReader.onload = function () {
  81. spFilesNum++;
  82. let videoLineDataHtml = `<div class="HoutaiContainerDialogLine4VideoFile btn" id="HoutaiContainerDialogLine4VideoFile${spFilesNum}">
  83. <div class="videoFileName">视频文件 ${spTheFile[i].name}</div>
  84. <div class="delVideo">删除</div>
  85. </div>`;
  86. $(".HoutaiContainerDialogLine4RightAdd").append(
  87. videoLineDataHtml
  88. );
  89. spFilesArr.push(spTheFile[i]);
  90. // 功能-添加中删除-反差内容-视频
  91. $("#HoutaiContainerDialogLine4VideoFile" + spFilesNum).on(
  92. "click",
  93. function () {
  94. console.log($(this).index());
  95. spFilesArr.splice($(this).index() - 1, 1);
  96. console.log(spFilesArr);
  97. this.remove();
  98. }
  99. );
  100. };
  101. //读取文件
  102. fileReader.readAsDataURL(spTheFile[i]);
  103. }
  104. };
  105. // 修改上传文件-封面
  106. let inputFileFMRevise = document.getElementById("uploadReviseFM");
  107. let theFileFMRevise;
  108. inputFileFMRevise.onchange = function () {
  109. // 获取用户上传的文件对象
  110. theFileFMRevise = inputFileFMRevise.files[0];
  111. // 实例化一个文件读取器
  112. let fileReader = new FileReader();
  113. // 将用户上传的文件对象作为参数,传入文件读取器的方法readAsDateURL
  114. fileReader.readAsDataURL(theFileFMRevise);
  115. // 文件读取器方法执行完毕后调用函数
  116. fileReader.onload = function () {
  117. $("#RFMImg").attr("src", fileReader.result);
  118. };
  119. };
  120. // 修改上传文件-图片
  121. let tpFilesNumRevise = 0;
  122. let tpFilesArrRevise = [];
  123. let tpInputFileRevise = document.getElementById("uploadReviseTP");
  124. let tpTheFileRevise;
  125. tpInputFileRevise.onchange = function () {
  126. // 获取用户上传的文件对象
  127. tpTheFileRevise = tpInputFileRevise.files;
  128. //获取选择图片的个数
  129. let length = tpTheFileRevise.length;
  130. // 回显
  131. for (let i = 0; i < length; i++) {
  132. // 实例化一个文件读取器
  133. let fileReader = new FileReader();
  134. fileReader.onload = function () {
  135. tpFilesNumRevise++;
  136. let imgDataHtml = `<div class="HoutaiContainerDialogLine3ImgFile">
  137. <img class="HoutaiContainerDialogTPImg" src="${fileReader.result}" alt="">
  138. <div class="delImg btn" id="delImg${tpFilesNumRevise}">删除</div>
  139. </div>`;
  140. $(".HoutaiContainerDialogLine3ReviseImg").before(imgDataHtml);
  141. tpFilesArrRevise.push(tpTheFileRevise[i]);
  142. console.log(tpFilesArrRevise);
  143. // 功能-添加中删除-反差内容-视频
  144. $("#delImg" + tpFilesNumRevise).on("click", function () {
  145. tpFilesArrRevise.splice($(this).parent().index(), 1);
  146. console.log(tpFilesArrRevise);
  147. $(this).parent().remove();
  148. });
  149. };
  150. //读取文件
  151. fileReader.readAsDataURL(tpTheFileRevise[i]);
  152. }
  153. };
  154. // 修改上传文件-视频
  155. let spFilesNumRevise = 0;
  156. let spFilesArrRevise = [];
  157. let spInputFileRevise = document.getElementById("uploadReviseSP");
  158. let spTheFileRevise;
  159. spInputFileRevise.onchange = function () {
  160. // 获取用户上传的文件对象
  161. spTheFileRevise = spInputFileRevise.files;
  162. //获取选择图片的个数
  163. let length = spTheFileRevise.length;
  164. // 回显
  165. for (let i = 0; i < length; i++) {
  166. // 实例化一个文件读取器
  167. let fileReader = new FileReader();
  168. fileReader.onload = function () {
  169. spFilesNumRevise++;
  170. let videoLineDataHtml = `<div class="HoutaiContainerDialogLine4VideoFile btn" id="HoutaiContainerDialogLine4VideoFile${spFilesNumRevise}">
  171. <div class="videoFileName">视频文件 ${spTheFileRevise[i].name}</div>
  172. <div class="delVideo">删除</div>
  173. </div>`;
  174. $(".HoutaiContainerDialogLine4RightRevise").append(
  175. videoLineDataHtml
  176. );
  177. spFilesArrRevise.push(spTheFileRevise[i]);
  178. // 功能-添加中删除-反差内容-视频
  179. $("#HoutaiContainerDialogLine4VideoFile" + spFilesNumRevise).on(
  180. "click",
  181. function () {
  182. console.log($(this).index());
  183. spFilesArrRevise.splice($(this).index() - 1, 1);
  184. console.log(spFilesArrRevise);
  185. this.remove();
  186. }
  187. );
  188. };
  189. //读取文件
  190. fileReader.readAsDataURL(spTheFileRevise[i]);
  191. }
  192. };
  193. // 接口调用-数据获取-反差列表
  194. function getData() {
  195. $.ajax({
  196. type: "post",
  197. url: "https://api.9169kkxstzsjkdd222.app/Admin/Adminbackoneeight/facha_list",
  198. dataType: "json",
  199. data: {
  200. //async: false,
  201. token: "b8e3bb6ef8747d7",
  202. page: tabId,
  203. size: 50,
  204. },
  205. success: function (res) {
  206. console.log(res);
  207. data = res.data;
  208. $(".SLHeader p").text(`反差内容( ${res.amount} )`);
  209. let AppleListHTML = "";
  210. $.each(data, function (index, value) {
  211. AppleListHTML += `
  212. <div id="${value.id}" class="HoutaiContainerBottomAppleListHeaders">
  213. <p class="HoutaiContainerBottomAppleListHeaderFM">
  214. <img src="${value.head_img}" alt="">
  215. </p>
  216. <p class="HoutaiContainerBottomAppleListHeaderBT">${value.site}</p>
  217. <p class="HoutaiContainerBottomAppleListHeaderNR">
  218. `;
  219. let booklength =
  220. value.book.length > 4 ? 4 : value.book.length;
  221. for (let i = 0; i < booklength; i++) {
  222. AppleListHTML += `<img src="${value.book[i]}" alt="">`;
  223. }
  224. AppleListHTML += `
  225. </p>
  226. <div class="HoutaiContainerBottomAppleListHeaderCZ">
  227. <p class="HoutaiContainerBottomAppleListHeaderCZck">查看</p>
  228. <p class="HoutaiContainerBottomAppleListHeaderCZxg">修改</p>
  229. <p class="HoutaiContainerBottomAppleListHeaderCZsc">删除</p>
  230. </div>
  231. </div>
  232. `;
  233. });
  234. $("#AppleList").html(AppleListHTML);
  235. },
  236. complete: function (res, status) {
  237. console.log(res);
  238. $("#page").paging({
  239. pageNo: tabId,
  240. totalPage: Math.ceil(res.responseJSON.all_count / 50),
  241. callback: function (num) {
  242. window.location.href =
  243. "https://api.9169kkxstzsjkdd222.app/contrast?TabId=" + num;
  244. },
  245. });
  246. let index;
  247. // 功能-删除-反差内容-弹窗展示
  248. $(".HoutaiContainerBottomAppleListHeaderCZsc").on(
  249. "click",
  250. function () {
  251. id = $(this).parent().parent().attr("id");
  252. $(".HoutaiContainerDialogSC").show();
  253. }
  254. );
  255. // 功能-删除-反差内容-取消删除
  256. $(".HoutaiContainerDialogASCdvertLeft").on(
  257. "click",
  258. function () {
  259. $(".HoutaiContainerDialogSC").hide();
  260. }
  261. );
  262. // 功能-删除-反差内容-确定删除
  263. $(".HoutaiContainerDialogSCAdvertRight").on(
  264. "click",
  265. function () {
  266. $.ajax({
  267. type: "post",
  268. url: "https://api.9169kkxstzsjkdd222.app/Admin/Adminbackoneeight/delete_fancha_list",
  269. dataType: "json",
  270. data: {
  271. token: "b8e3bb6ef8747d7",
  272. fc_id: id,
  273. },
  274. success: function (res) {
  275. console.log(res);
  276. window.location.reload();
  277. },
  278. });
  279. }
  280. );
  281. // 功能-修改-反差内容-弹窗展示
  282. $(".HoutaiContainerBottomAppleListHeaderCZxg").on(
  283. "click",
  284. function () {
  285. $(".HoutaiContainerDialogRevise").show();
  286. id = $(this).parent().parent().attr("id");
  287. index = $(this).parent().parent().index();
  288. // 修改弹窗-获取标题
  289. $(".HoutaiContainerDialogLine1RightRevise").val(
  290. data[index].site
  291. );
  292. // 修改弹窗-获取封面文件
  293. $("#RFMImg").attr("src", data[index].head_img);
  294. // 修改弹窗-获取图片文件
  295. console.log(data[index].book.length);
  296. for (let i = 0; i < data[index].book.length; i++) {
  297. tpFilesNumRevise++;
  298. let HoutaiContainerDialogLine2RightRevise = `<div class="HoutaiContainerDialogLine3ImgFile">
  299. <img class="HoutaiContainerDialogTPImg" src="${data[index].book[i]}" alt="">
  300. <div class="delImg btn" id="delImg${tpFilesNumRevise}">删除</div>
  301. </div>`;
  302. $(".HoutaiContainerDialogLine3ReviseImg").before(
  303. HoutaiContainerDialogLine2RightRevise
  304. );
  305. tpFilesArrRevise.push(data[index].book[i]);
  306. console.log(tpFilesArrRevise);
  307. // 功能-添加中删除-反差内容-视频
  308. $("#delImg" + tpFilesNumRevise).on(
  309. "click",
  310. function () {
  311. tpFilesArrRevise.splice(
  312. $(this).parent().index(),
  313. 1
  314. );
  315. console.log(tpFilesArrRevise);
  316. $(this).parent().remove();
  317. }
  318. );
  319. }
  320. // 修改弹窗-获取视频文件
  321. for (
  322. let i = 0;
  323. i < data[index].hj_video_url.length;
  324. i++
  325. ) {
  326. spFilesNumRevise++;
  327. let videoLineDataHtml = `<div class="HoutaiContainerDialogLine4VideoFile btn" id="HoutaiContainerDialogLine4VideoFileRevise${spFilesNumRevise}">
  328. <div class="videoFileName">视频文件 ${data[index].hj_video_url[i]}</div>
  329. <div class="delVideo">删除</div>
  330. </div>`;
  331. $(".HoutaiContainerDialogLine4RightRevise").append(
  332. videoLineDataHtml
  333. );
  334. spFilesArrRevise.push(data[index].hj_video_url[i]);
  335. // 功能-添加中删除-反差内容-视频
  336. $(
  337. "#HoutaiContainerDialogLine4VideoFileRevise" +
  338. spFilesNumRevise
  339. ).on("click", function () {
  340. console.log($(this).index());
  341. spFilesArrRevise.splice($(this).index() - 1, 1);
  342. console.log(spFilesArrRevise);
  343. this.remove();
  344. });
  345. }
  346. }
  347. );
  348. // 功能-修改-反差内容-弹窗隐藏
  349. $(".HoutaiContainerDialogLine5LeftRevise").on(
  350. "click",
  351. function () {
  352. tpFilesArrRevise = [];
  353. spFilesArrRevise = [];
  354. let HoutaiContainerDialogLine3RightReviseHTML = `
  355. <div class="HoutaiContainerDialogLine3ReviseImg btn">
  356. <img id="RTPImg" src="/Public/Admin/img/tttp.png" height="100%" width="100%">
  357. <input type="file" id="uploadReviseTP" multiple="multiple" />
  358. </div>`;
  359. $(".HoutaiContainerDialogLine3RightRevise").html(
  360. HoutaiContainerDialogLine3RightReviseHTML
  361. );
  362. let HoutaiContainerDialogLine4RightReviseHTML = `
  363. <div class="HoutaiContainerDialogLine4ReviseSP btn">
  364. <img id="RSPImg" src="/Public/Admin/img/tttp.png" height="100%" width="100%">
  365. <input type="file" id="uploadReviseSP" multiple />
  366. </div>`;
  367. $(".HoutaiContainerDialogLine4RightRevise").html(
  368. HoutaiContainerDialogLine4RightReviseHTML
  369. );
  370. $(".HoutaiContainerDialogRevise").hide();
  371. // 功能-修改封面-上传内容封面
  372. $(".HoutaiContainerDialogLine2RightRevise").on(
  373. "click",
  374. function () {
  375. $("#uploadReviseFM").click();
  376. }
  377. );
  378. // 功能-修改图片-打开上传图片窗口
  379. $("#RTPImg").on("click", function () {
  380. $("#uploadReviseTP").click();
  381. });
  382. // 功能-修改视频-打开上传视频窗口
  383. $("#RSPImg").on("click", function () {
  384. $("#uploadReviseSP").click();
  385. });
  386. // 修改上传文件-图片
  387. let tpInputFileRevise =
  388. document.getElementById("uploadReviseTP");
  389. let tpTheFileRevise;
  390. tpInputFileRevise.onchange = function () {
  391. // 获取用户上传的文件对象
  392. tpTheFileRevise = tpInputFileRevise.files;
  393. //获取选择图片的个数
  394. let length = tpTheFileRevise.length;
  395. // 回显
  396. for (let i = 0; i < length; i++) {
  397. // 实例化一个文件读取器
  398. let fileReader = new FileReader();
  399. fileReader.onload = function () {
  400. tpFilesNumRevise++;
  401. let imgDataHtml = `<div class="HoutaiContainerDialogLine3ImgFile">
  402. <img class="HoutaiContainerDialogTPImg" src="${fileReader.result}" alt="">
  403. <div class="delImg btn" id="delImg${tpFilesNumRevise}">删除</div>
  404. </div>`;
  405. $(
  406. ".HoutaiContainerDialogLine3ReviseImg"
  407. ).before(imgDataHtml);
  408. tpFilesArrRevise.push(tpTheFileRevise[i]);
  409. console.log(tpFilesArrRevise);
  410. // 功能-添加中删除-反差内容-视频
  411. $("#delImg" + tpFilesNumRevise).on(
  412. "click",
  413. function () {
  414. tpFilesArrRevise.splice(
  415. $(this).parent().index(),
  416. 1
  417. );
  418. console.log(tpFilesArrRevise);
  419. $(this).parent().remove();
  420. }
  421. );
  422. };
  423. //读取文件
  424. fileReader.readAsDataURL(tpTheFileRevise[i]);
  425. }
  426. };
  427. // 修改上传文件-视频
  428. let spInputFileRevise =
  429. document.getElementById("uploadReviseSP");
  430. let spTheFileRevise;
  431. spInputFileRevise.onchange = function () {
  432. // 获取用户上传的文件对象
  433. spTheFileRevise = spInputFileRevise.files;
  434. //获取选择图片的个数
  435. let length = spTheFileRevise.length;
  436. // 回显
  437. for (let i = 0; i < length; i++) {
  438. // 实例化一个文件读取器
  439. let fileReader = new FileReader();
  440. fileReader.onload = function () {
  441. spFilesNumRevise++;
  442. let videoLineDataHtml = `<div class="HoutaiContainerDialogLine4VideoFile btn" id="HoutaiContainerDialogLine4VideoFile${spFilesNumRevise}">
  443. <div class="videoFileName">视频文件 ${spTheFileRevise[i].name}</div>
  444. <div class="delVideo">删除</div>
  445. </div>`;
  446. $(
  447. ".HoutaiContainerDialogLine4RightAdd"
  448. ).append(videoLineDataHtml);
  449. spFilesArrRevise.push(spTheFileRevise[i]);
  450. // 功能-添加中删除-反差内容-视频
  451. $(
  452. "#HoutaiContainerDialogLine4VideoFile" +
  453. spFilesNumRevise
  454. ).on("click", function () {
  455. console.log($(this).index());
  456. spFilesArrRevise.splice(
  457. $(this).index() - 1,
  458. 1
  459. );
  460. console.log(spFilesArrRevise);
  461. this.remove();
  462. });
  463. };
  464. //读取文件
  465. fileReader.readAsDataURL(spTheFileRevise[i]);
  466. }
  467. };
  468. }
  469. );
  470. // 功能-修改-反差内容-确认修改
  471. $(".HoutaiContainerDialogLine5RightRevise").on(
  472. "click",
  473. function () {
  474. let allTPFilesArr = tpFilesArrRevise;
  475. let uptheFileFMRevise = theFileFMRevise
  476. ? theFileFMRevise
  477. : $("#RFMImg").attr("src");
  478. allTPFilesArr.unshift(uptheFileFMRevise);
  479. var formFileRevise = new FormData();
  480. formFileRevise.append("fc_id", id);
  481. formFileRevise.append(
  482. "title",
  483. $(".HoutaiContainerDialogLine1RightRevise").val()
  484. );
  485. formFileRevise.append("token", "b8e3bb6ef8747d7");
  486. for (let i in allTPFilesArr) {
  487. formFileRevise.append("img[]", allTPFilesArr[i]);
  488. }
  489. for (let i in spFilesArrRevise) {
  490. formFileRevise.append("mp4[]", spFilesArrRevise[i]);
  491. }
  492. $.ajax({
  493. type: "post",
  494. url: "https://api.9169kkxstzsjkdd222.app/Admin/Adminbackoneeight/save_fancha_detail",
  495. dataType: "json",
  496. data: formFileRevise,
  497. async: true,
  498. cache: false,
  499. contentType: false,
  500. processData: false,
  501. success: function (res) {
  502. // alert("修改成功")
  503. console.log(res);
  504. // window.location.reload();
  505. },
  506. });
  507. }
  508. );
  509. // 功能-查看-反差内容-弹窗展示
  510. $(".HoutaiContainerBottomAppleListHeaderCZck").on(
  511. "click",
  512. function () {
  513. id = $(this).parent().parent().attr("id");
  514. index = $(this).parent().parent().index();
  515. $(".HoutaiContainerDialogTitleCheck").text(
  516. data[index].site
  517. );
  518. $(".HoutaiContainerDialogFMImg").attr(
  519. "src",
  520. data[index].head_img
  521. );
  522. let HoutaiContainerDialogLine2RightCheckHTML = "";
  523. for (let i = 0; i < data[index].book.length; i++) {
  524. HoutaiContainerDialogLine2RightCheckHTML += `<img class="HoutaiContainerDialogTPImg" src="${data[index].book[i]}" alt="">`;
  525. }
  526. $(".HoutaiContainerDialogLine2RightCheck").html(
  527. HoutaiContainerDialogLine2RightCheckHTML
  528. );
  529. let HoutaiContainerDialogLine3RightCheckHTML = "";
  530. for (
  531. let i = 0;
  532. i < data[index].hj_video_url.length;
  533. i++
  534. ) {
  535. HoutaiContainerDialogLine3RightCheckHTML += `<img class="HoutaiContainerDialogSPImg" src="Public/Admin/img/testimg.png" alt="">`;
  536. }
  537. $(".HoutaiContainerDialogLine3RightCheck").html(
  538. HoutaiContainerDialogLine3RightCheckHTML
  539. );
  540. // 交互-视频播放-展示弹窗
  541. $(".HoutaiContainerDialogSPImg").on(
  542. "click",
  543. function () {
  544. index = $(this).parent().parent().index();
  545. let videoArr = data[index].hj_video_url;
  546. videoSrc = videoArr[$(this).index()];
  547. let HoutaiContainerDialogVideoHTML = `<div class="HoutaiContainerDialogDeputyVideo">
  548. <img class="closeVideo" src="/Public/Admin/img/close.png" alt="">
  549. <div id="h5">
  550. <img class="toogleImg" src="/Public/Admin/img/end.png" alt="">
  551. </div>
  552. </div>`;
  553. $(".HoutaiContainerDialogVideo").html(
  554. HoutaiContainerDialogVideoHTML
  555. );
  556. // 交互-视频播放-关闭弹窗
  557. $(".closeVideo").on("click", function () {
  558. md = null;
  559. $(".HoutaiContainerDialogVideo").html("");
  560. $(".HoutaiContainerDialogVideo").hide();
  561. });
  562. $(".HoutaiContainerDialogVideo").show();
  563. var md = new MuiPlayer({
  564. container: "#h5",
  565. title: "",
  566. // autoplay: true,
  567. initFullFixed: true,
  568. autoplay: false,
  569. themeColor: "#FF6A00",
  570. lang: "en",
  571. poster: data[index].head_img,
  572. src: videoSrc,
  573. // src: 'https://look.slgj688.com/videos/one/WXTS/53045/394.m3u8',
  574. parse: {
  575. type: "hls",
  576. loader: Hls,
  577. config: {
  578. debug: false,
  579. },
  580. },
  581. videoAttribute: [
  582. {
  583. attrKey: "webkit-playsinline",
  584. attrValue: "webkit-playsinline",
  585. },
  586. {
  587. attrKey: "playsinline",
  588. attrValue: "playsinline",
  589. },
  590. {
  591. attrKey: "x5-video-player-type",
  592. attrValue: "h5-page",
  593. },
  594. ],
  595. plugins: [
  596. new MuiPlayerMobilePlugin({
  597. key: "01F01D01G01I01F01H01H01K01C01J01F01J01D01H01K",
  598. showMenuButton: true,
  599. }),
  600. ],
  601. });
  602. md.on("ready", function () {
  603. $("#h5").show();
  604. $(".quanquan").hide();
  605. document.querySelector(
  606. ".mplayer-header"
  607. ).style.display = "none";
  608. md.on("seek-progress", function (e) {
  609. // console.log("names");
  610. md.video().play();
  611. });
  612. md.video().onended = function () {
  613. console.log("播放完成");
  614. // if (ad.video.currentTime > '33') {//视频时间,单位’秒‘,建议减1秒
  615. $("#mui-player").remove();
  616. $("#bj").show();
  617. $("#bj").on("click", function () {
  618. window.location.href =
  619. "service.html?uid=" + uid;
  620. });
  621. };
  622. $(".toogleImg").on("click", function (e) {
  623. e.stopPropagation();
  624. console.log($(this).attr("src"));
  625. let toogleStatus = $(this).attr("src");
  626. if (
  627. toogleStatus ==
  628. "/Public/Admin/img/end.png"
  629. ) {
  630. md.video().play();
  631. $(".toogleImg").attr(
  632. "src",
  633. "/Public/Admin/img/star.png"
  634. );
  635. } else {
  636. md.video().pause();
  637. $(".toogleImg").attr(
  638. "src",
  639. "/Public/Admin/img/end.png"
  640. );
  641. }
  642. });
  643. md.video().addEventListener(
  644. "playing",
  645. function () {
  646. $(".toogleImg").attr(
  647. "src",
  648. "/Public/Admin/img/star.png"
  649. );
  650. console.log("开始播放");
  651. md.toggleControls(false);
  652. }
  653. );
  654. md.video().addEventListener(
  655. "pause",
  656. function () {
  657. console.log("暂停播放");
  658. md.video().pause();
  659. $(".toogleImg").attr(
  660. "src",
  661. "/Public/Admin/img/end.png"
  662. );
  663. }
  664. );
  665. });
  666. }
  667. );
  668. $(".HoutaiContainerDialogCheck").show();
  669. }
  670. );
  671. // 功能-查看-反差内容-弹窗隐藏
  672. $(".HoutaiContainerDialogLine4CheckBtn").on(
  673. "click",
  674. function () {
  675. $(".HoutaiContainerDialogCheck").hide();
  676. }
  677. );
  678. },
  679. });
  680. }
  681. getData();
  682. // 功能-上传封面-上传内容封面
  683. $(".HoutaiContainerDialogLine2RightAdd").on("click", function () {
  684. $("#uploadAddFM").click();
  685. });
  686. // 功能-上传图片-打开上传图片窗口
  687. $("#TPImg").on("click", function () {
  688. $("#uploadAddTP").click();
  689. });
  690. // 功能-上传视频-打开上传视频窗口
  691. $("#SPImg").on("click", function () {
  692. $("#uploadAddSP").click();
  693. });
  694. // 功能-修改封面-上传内容封面
  695. $(".HoutaiContainerDialogLine2RightRevise").on("click", function () {
  696. $("#uploadReviseFM").click();
  697. });
  698. // 功能-修改图片-打开上传图片窗口
  699. $("#RTPImg").on("click", function () {
  700. $("#uploadReviseTP").click();
  701. });
  702. // 功能-修改视频-打开上传视频窗口
  703. $("#RSPImg").on("click", function () {
  704. $("#uploadReviseSP").click();
  705. });
  706. // 功能-新增-反差内容-弹窗展示
  707. $(".SLHeaderCreate").on("click", function () {
  708. $(".HoutaiContainerDialogAdd").show();
  709. });
  710. // 功能-新增-反差内容-弹窗隐藏
  711. $(".HoutaiContainerDialogLine5LeftAdd").on("click", function () {
  712. $(".HoutaiContainerDialogAdd").hide();
  713. });
  714. // 功能-新增-反差内容-确认新增
  715. $(".HoutaiContainerDialogLine5RightAdd").on("click", function () {
  716. let allTPFilesArr = tpFilesArr;
  717. allTPFilesArr.unshift(theFileFM);
  718. var formFile = new FormData();
  719. formFile.append(
  720. "title",
  721. $(".HoutaiContainerDialogLine1RightAdd").val()
  722. );
  723. formFile.append("token", "b8e3bb6ef8747d7");
  724. for (let i in allTPFilesArr) {
  725. formFile.append("img[]", allTPFilesArr[i]);
  726. }
  727. for (let i in spFilesArr) {
  728. formFile.append("mp4[]", spFilesArr[i]);
  729. }
  730. $.ajax({
  731. type: "post",
  732. url: "https://api.9169kkxstzsjkdd222.app/Admin/Adminbackoneeight/add_test_video",
  733. dataType: "json",
  734. data: formFile,
  735. async: true,
  736. cache: false,
  737. contentType: false,
  738. processData: false,
  739. success: function (res) {
  740. // alert("添加成功");
  741. console.log(res);
  742. window.location.reload();
  743. },
  744. });
  745. });
  746. });