addVideo.html 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>添加分类</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  9. <link rel="stylesheet" href="../../static/css/font.css">
  10. <link rel="stylesheet" href="../../static/css/weadmin.css">
  11. <link rel="stylesheet" href="../../static/css/style.css">
  12. <!-- 让IE8/9支持媒体查询,从而兼容栅格 -->
  13. <!--[if lt IE 9]>
  14. <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  15. <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
  16. <![endif]-->
  17. <style>
  18. html{
  19. overflow-y: auto;
  20. }
  21. .layui-form-label{
  22. width: 100px;
  23. }
  24. .layui-input-block{
  25. margin-left: 138px;
  26. }
  27. .w-e-toolbar{
  28. padding: 0 !important;
  29. }
  30. .w-e-toolbar .w-e-menu{
  31. padding: 5px 4px !important;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <div class="weadmin-body">
  37. <form class="layui-form">
  38. <div class="layui-form-item">
  39. <label class="layui-form-label">
  40. 视频名称:
  41. </label>
  42. <div class="layui-input-block steta_grouds">
  43. <input type="text" placeholder="请输入视频名称" class="layui-input textName" lay-verify="required">
  44. </div>
  45. </div>
  46. <div class="layui-form-item">
  47. <label class="layui-form-label">视频:</label>
  48. <div class="layui-input-block">
  49. <input type="text" class="layui-input videoName" style="margin-bottom: 15px" disabled placeholder="视频名称">
  50. <button type="button" class="layui-btn" id="upload1">
  51. <i class="layui-icon">&#xe67c;</i>上传视频
  52. </button>
  53. </div>
  54. </div>
  55. <div class="layui-form-item" style="text-align: center;padding-top: 50px">
  56. <button class="layui-btn" lay-submit lay-filter="videoBtn">提交</button>
  57. </div>
  58. </form>
  59. <span class="text" style="display: none"></span>
  60. </div>
  61. <script src="../../lib/layui/layui.js" charset="utf-8"></script>
  62. <script>
  63. layui.use(['form','layer','jquery','upload'], function(){
  64. var form = layui.form,
  65. $ = layui.jquery,
  66. upload= layui.upload,
  67. layer = layui.layer;
  68. form.render();
  69. if (sessionStorage.getItem('QRcodeIDs') !=""){
  70. QRcodeVideo(sessionStorage.getItem('QRcodeIDs'))
  71. }
  72. var index,videoName,videoUrl;
  73. var uploadInst = upload.render({
  74. elem: '#upload1'
  75. ,url: 'http://apptest.jieweizhineng.com/api/swagger/api/common/v1/uploadFile'
  76. ,accept: 'video'
  77. ,before: function(obj){
  78. index = layer.load(2);
  79. obj.preview(function(index, file, result){
  80. $('.videoName').val(file.name);
  81. });
  82. }
  83. ,done: function(res){
  84. //上传成功
  85. layer.close(index);
  86. if(res.code == 200){
  87. parent.onFocus();
  88. parent.addVideo(res.data.fullURL);
  89. videoUrl = res.data.fullURL;
  90. videoName = res.data.fileName;
  91. return layer.msg('上传成功');
  92. }
  93. //如果上传失败
  94. layer.msg('上传失败');
  95. }
  96. ,error: function(){
  97. layer.msg('请检查网络!');
  98. }
  99. });
  100. form.on('submit(videoBtn)', function(){
  101. var videoItemobj = [{id:$('.videoName').attr('video-id'),deleteFlag:false,videoName:videoName,videoUrl:videoUrl,parentId:sessionStorage.getItem("QRcodeID"),title:$('.textName').val()}];
  102. $.ajax({
  103. url:'http://apptest.jieweizhineng.com/api/swagger/api/page/v1/updateVideo',
  104. type:'post',
  105. data:JSON.stringify(videoItemobj),
  106. contentType:'application/json;charset=utf-8',
  107. dataType:'json',
  108. success:function (res) {
  109. if (res.code === '200'){
  110. parent.onFocus();
  111. parent.pageRelationIdFun(res.data);
  112. layer.msg('视频修改成功');
  113. }else {
  114. layer.msg('视频修改失败,请检查信息');
  115. }
  116. },
  117. error:function () {
  118. layer.msg('网络错误,请检查网络');
  119. }
  120. });
  121. return false;
  122. });
  123. // 数据回显
  124. function QRcodeVideo(id) {
  125. $.ajax({
  126. url: 'http://apptest.jieweizhineng.com/api/swagger/api/page/v1/getPageEdit/'+sessionStorage.getItem('QRcodeDetaileID'),
  127. type: 'get',
  128. dataType: 'json',
  129. success: function (res) {
  130. for (var i = 0; i < res.data.pageItemList.length; i++) {
  131. if (res.data.pageItemList[i].pageRelation.businessType == "VIDEO" && res.data.pageItemList[i].pageRelation.businessId == id) {
  132. $('.textName').val(res.data.pageItemList[i].videoList[0].title);
  133. $('.videoName').val(res.data.pageItemList[i].videoList[0].videoName);
  134. $('.videoName').attr('video-id',res.data.pageItemList[i].videoList[0].id)
  135. }
  136. }
  137. },
  138. error:function () {
  139. layer.msg('请检查网络', {icon: 2});
  140. }
  141. });
  142. }
  143. });
  144. </script>
  145. </body>
  146. </html>