plat-activity-edit.blade.php 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. @extends('layouts.base')
  2. @section('title', '页面编辑')
  3. @section('content')
  4. <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}"/>
  5. <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-ohter.css')}}"/>
  6. <link rel="stylesheet" href="{{static_url('css/public-number.css')}}">
  7. <style>
  8. .el-checkbox-group {
  9. position: relative;
  10. z-index: 0;
  11. }
  12. .el-checkbox {
  13. margin-top: 10px !important;
  14. }
  15. </style>
  16. <div id='re_content'>
  17. <div class="con" v-cloak>
  18. <div class="setting">
  19. <el-form ref="form" label-width="15%">
  20. <div class="block">
  21. <div class="title"><span
  22. style="width: 4px;height: 18px;background-color: #29ba9c;margin-right:15px;display:inline-block;"></span><b>分类详情</b>
  23. </div>
  24. <el-form-item label="页面名称">
  25. <el-tag type="primary"> [[form.another_name]]</el-tag>
  26. </el-form-item>
  27. <el-form-item label="是否启用">
  28. <el-switch
  29. :active-value="1"
  30. :inactive-value="0"
  31. v-model="form.open_state"
  32. active-color="#13ce66"
  33. inactive-color="#C0C0C0"
  34. >
  35. </el-switch>
  36. </el-form-item>
  37. <el-form-item label="顶部图片">
  38. <div class="upload-box" @click="openUpload('top_image',1,'one')" v-if="!form.top_image_url">
  39. <i class="el-icon-plus" style="font-size:32px"></i>
  40. </div>
  41. <div @click="openUpload('top_image',1,'one')" class="upload-boxed" v-if="form.top_image_url"
  42. style="height:150px;">
  43. <img :src="form.top_image_url" alt=""
  44. style="width:300px;height:150px;border-radius: 5px;cursor: pointer;">
  45. <div class="upload-boxed-text">点击重新上传</div>
  46. <i class="el-icon-close" @click.stop="clearImg('top_image')" title="点击清除图片"></i>
  47. </div>
  48. </el-form-item>
  49. <el-form-item label="H5海报">
  50. <template>
  51. <el-select v-model="form.web_poster_id" filterable placeholder="请选择">
  52. <el-option
  53. v-for="v in poster_list"
  54. :key="v.id"
  55. :label="v.title"
  56. :value="v.id">
  57. </el-option>
  58. </el-select>
  59. </template>
  60. <div class="tip">建议使用新海报-H5商城海报</div>
  61. </el-form-item>
  62. <el-form-item label="小程序海报">
  63. <template>
  64. <el-select v-model="form.mini_poster_id" filterable placeholder="请选择">
  65. <el-option
  66. v-for="v in poster_list"
  67. :key="v.id"
  68. :label="v.title"
  69. :value="v.id">
  70. </el-option>
  71. </el-select>
  72. </template>
  73. <div class="tip">建议使用新海报-微信小程序海报</div>
  74. </el-form-item>
  75. <el-form-item label="底部提示信息">
  76. <div class="vue-main-form">
  77. <el-form-item label="" style="margin-bottom: 60px;width: 70%">
  78. <tinymceee v-model="form.bottom_message" v-if="form.bottom_message!==undefined"></tinymceee>
  79. </el-form-item>
  80. </div>
  81. </el-form-item>
  82. <upload-multimedia-img :upload-show="uploadShow" :type="type" :name="chooseImgName"
  83. :sel-Num="selNum" @replace="changeProp"
  84. @sure="sureImg"></upload-multimedia-img>
  85. </div>
  86. </el-form>
  87. </div>
  88. <div class="confirm-btn">
  89. <el-button :loading="submit_loading" type="primary" @click="submit">提交</el-button>
  90. </div>
  91. </div>
  92. </div>
  93. <script src="{{resource_get('static/yunshop/tinymce4.7.5/tinymce.min.js')}}"></script>
  94. @include('public.admin.uploadMultimediaImg')
  95. @include('public.admin.tinymceee')
  96. <script>
  97. var app = new Vue({
  98. el: "#re_content",
  99. delimiters: ['[[', ']]'],
  100. name: 'test',
  101. data() {
  102. let id = "{!!($_GET['id']) !!}";
  103. return {
  104. 'form': {
  105. 'id': id,
  106. },
  107. 'uploadShow': false,
  108. 'chooseImgName': '',
  109. 'type': '',
  110. 'selNum': '',
  111. 'submit_loading': false,
  112. 'poster_list': [],
  113. }
  114. },
  115. created() {
  116. this.getData();
  117. },
  118. mounted() {
  119. },
  120. methods: {
  121. clearImg(str, type, index) {
  122. if (!type) {
  123. this.form[str] = "";
  124. this.form[str + '_url'] = "";
  125. } else {
  126. this.form[str].splice(index, 1);
  127. this.form[str + '_url'].splice(index, 1);
  128. }
  129. this.$forceUpdate();
  130. }, changeProp(val) {
  131. if (val == true) {
  132. this.uploadShow = false;
  133. } else {
  134. this.uploadShow = true;
  135. }
  136. },
  137. sureImg(name, uploadShow, fileList) {
  138. if (fileList.length <= 0) {
  139. return
  140. }
  141. console.log(name);
  142. console.log(fileList);
  143. this.form[name] = fileList[0].attachment;
  144. this.form[name + '_url'] = fileList[0].url;
  145. },
  146. openUpload(str, type, sel) {
  147. this.chooseImgName = str;
  148. this.uploadShow = true;
  149. this.type = type;
  150. this.selNum = sel;
  151. },
  152. getData() {
  153. this.$http.post('{!! yzWebFullUrl('plugin.cps-sub-platform.admin.plat-activity.edit') !!}', {
  154. 'id': this.form.id,
  155. 'is_json': 1
  156. }).then(response => {
  157. if (response.data.result) {
  158. this.form = response.data.data.activity_data;
  159. this.poster_list = response.data.data.poster_list;
  160. } else {
  161. this.$message({message: response.data.msg, type: 'error'});
  162. }
  163. }, response => {
  164. this.$message({message: response.data.msg, type: 'error'});
  165. })
  166. },
  167. submit() {
  168. let that = this;
  169. this.submit_loading = true;
  170. this.$http.post('{!! yzWebFullUrl('plugin.cps-sub-platform.admin.plat-activity.change') !!}', this.form).then(response => {
  171. if (response.data.result) {
  172. this.$message({message: response.data.msg, type: 'success'});
  173. this.submit_loading = false;
  174. this.getData();
  175. } else {
  176. this.$message({message: response.data.msg, type: 'error'});
  177. this.submit_loading = false;
  178. }
  179. }, response => {
  180. this.$message({message: response.data.msg, type: 'error'});
  181. this.submit_loading = false;
  182. })
  183. }
  184. },
  185. })
  186. </script>
  187. @endsection