edit1.html 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867
  1. {extend name="public/layout" /} {block name="title"}素材库{/block} {block name="body"}
  2. <!--<link rel="stylesheet" href="__LAYUI__/common.css" media="all">-->
  3. <style type="text/css">
  4. html,
  5. body {
  6. display: block;
  7. width: 100%;
  8. background-color: #fff;
  9. }
  10. .layui-fluid {
  11. display: block;
  12. border-radius: 5px;
  13. background-color: #ffffff;
  14. padding: 15px 30px;
  15. }
  16. .layui-icon {
  17. font-size: 18px !important;
  18. line-height: 38px;
  19. }
  20. .layui-input-inline {
  21. line-height: 38px;
  22. }
  23. .layui-input-inline input {
  24. margin-right: 10px;
  25. }
  26. .layui-form-item .layui-input-inline {}
  27. .input-indent-box-small {
  28. margin-left: 10px;
  29. }
  30. .layui-tab {
  31. padding: 15px;
  32. height: 100%;
  33. }
  34. .layui-card-body {
  35. overflow: hidden;
  36. }
  37. .layui-card-body .layui-form-item {
  38. float: left;
  39. clear: none;
  40. width: 330px;
  41. text-align: left;
  42. }
  43. .layui-table-view .layui-table th,
  44. .layui-table-view .layui-table td {
  45. text-align: center;
  46. border-color: #B6CADE;
  47. }
  48. .layui-table thead tr,
  49. .layui-table-header {
  50. background-color: #D8E6F1;
  51. }
  52. .input-indent-box {
  53. display: inline;
  54. width: 100%;
  55. }
  56. .input-indent-box-small {
  57. display: inline;
  58. width: 20%;
  59. }
  60. .adding {
  61. cursor: pointer;
  62. }
  63. .upload-img .area i {
  64. font-size: 50px;
  65. color: #009688;
  66. }
  67. .evi-block {
  68. float: left;
  69. margin-right: 10px;
  70. }
  71. /*///*/
  72. .imageDiv {
  73. display: inline-block;
  74. width: 140px;
  75. height: 125px;
  76. -webkit-box-sizing: border-box;
  77. -moz-box-sizing: border-box;
  78. box-sizing: border-box;
  79. border: 1px dashed darkgray;
  80. background: #f8f8f8;
  81. position: relative;
  82. overflow: hidden;
  83. }
  84. .addImages {
  85. display: inline-block;
  86. width: 140px;
  87. height: 125px;
  88. -webkit-box-sizing: border-box;
  89. -moz-box-sizing: border-box;
  90. box-sizing: border-box;
  91. border: 1px dashed darkgray;
  92. background: #f8f8f8;
  93. position: relative;
  94. overflow: hidden;
  95. }
  96. .text-detail {
  97. display: flex;
  98. flex-direction: column;
  99. align-items: center;
  100. justify-content: center;
  101. }
  102. .text-detail>span {
  103. font-size: 40px;
  104. }
  105. .imageDiv div {
  106. width: 100%;
  107. height: 100%;
  108. position: absolute;
  109. top: 0px;
  110. background-color: #e6e6e600;
  111. }
  112. .imageDiv div i {
  113. display: none;
  114. font-size: 31px;
  115. position: absolute;
  116. top: 37%;
  117. left: 40%;
  118. }
  119. .imageDiv div:hover {
  120. background-color: #e6e6e680;
  121. }
  122. .imageDiv div:hover i {
  123. display: block;
  124. cursor: pointer;
  125. }
  126. .rotate180 {
  127. -webkit-transform: rotate(180deg);
  128. transform: rotate(180deg);
  129. }
  130. .layui-edge.rotate180 {
  131. margin-top: -9px;
  132. }
  133. .layui-input-inline.input-longer-inline {
  134. width: 290px;
  135. }
  136. .goback {
  137. float: right;
  138. }
  139. .goback a {
  140. color: #269efb;
  141. }
  142. .goback i {
  143. position: relative !important;
  144. }
  145. @media screen and (max-width: 450px) {
  146. .layui-form-item {
  147. position: relative;
  148. }
  149. .layui-form-item .layui-input-inline {
  150. padding-right: 40px !important;
  151. }
  152. .adding {
  153. position: absolute;
  154. right: 10px;
  155. top: 0;
  156. }
  157. }
  158. input:disabled,
  159. input[disabled] {
  160. color: black;
  161. opacity: 1;
  162. -webkit-text-fill-color: black;
  163. -webkit-opacity: 1;
  164. }
  165. .textlh1 {
  166. overflow: hidden;
  167. text-overflow: ellipsis;
  168. white-space: nowrap;
  169. }
  170. .pingmi {
  171. position: absolute;
  172. right: 9%;
  173. top: 0;
  174. }
  175. .layui-btn-primary {
  176. color: #249EFB;
  177. /* border: 1px solid #249EFB; */
  178. }
  179. .layui-btn-primary:hover {
  180. background-color: #E3F7FF;
  181. color: #249EFB;
  182. }
  183. .layui-card-body {
  184. padding: 10px 0px;
  185. }
  186. .relative {
  187. position: relative;
  188. }
  189. .noneClass {
  190. display: none !important;
  191. }
  192. .wordlist {
  193. width: 20px;
  194. position: absolute;
  195. top: 43px;
  196. right: 2px;
  197. display: flex;
  198. flex-direction: column;
  199. z-index: 99999;
  200. height: auto;
  201. justify-content: flex-start;
  202. align-items: center;
  203. box-sizing: border-box;
  204. padding: 3px 0px;
  205. overflow: hidden;
  206. max-height: 297px;
  207. -ms-overflow-style: none;
  208. /* IE 10+ */
  209. scrollbar-width: none;
  210. /* Firefox */
  211. overflow-y: scroll;
  212. background-color: #f5f5f5;
  213. }
  214. .wordlist::-webkit-scrollbar {
  215. display: none;
  216. /* Chrome Safari */
  217. }
  218. .wordlist>li {
  219. width: 20px;
  220. height: 37px;
  221. cursor: pointer;
  222. display: flex;
  223. justify-content: center;
  224. align-items: center;
  225. margin-bottom: 0px;
  226. line-height: 37px;
  227. }
  228. .li_active {
  229. font-weight: 700;
  230. background-color: #249EFB;
  231. color: #fff;
  232. }
  233. .c_wordlist {
  234. width: 20px;
  235. position: absolute;
  236. top: 43px;
  237. right: 31px;
  238. display: flex;
  239. flex-direction: column;
  240. z-index: 99999;
  241. height: auto;
  242. justify-content: flex-start;
  243. align-items: center;
  244. box-sizing: border-box;
  245. padding: 4px 0px;
  246. overflow: hidden;
  247. max-height: 297px;
  248. -ms-overflow-style: none;
  249. /* IE 10+ */
  250. scrollbar-width: none;
  251. /* Firefox */
  252. overflow-y: scroll;
  253. background-color: #f5f5f5;
  254. }
  255. .c_wordlist::-webkit-scrollbar {
  256. display: none;
  257. /* Chrome Safari */
  258. }
  259. .c_wordlist>li {
  260. width: 20px;
  261. height: 37px;
  262. cursor: pointer;
  263. display: flex;
  264. justify-content: center;
  265. align-items: center;
  266. margin-bottom: 0px;
  267. line-height: 37px;
  268. }
  269. dd {
  270. border-bottom: 1px solid #EFEFEF;
  271. }
  272. .layui-anim-upbit {
  273. -ms-overflow-style: none;
  274. /* IE 10+ */
  275. scrollbar-width: none;
  276. /* Firefox */
  277. overflow-y: scroll;
  278. background-color: #fff;
  279. }
  280. .layui-anim-upbit::-webkit-scrollbar {
  281. display: none;
  282. /* Chrome Safari */
  283. }
  284. .layui-form-xxkbg {
  285. background: #ECECEC;
  286. overflow: hidden;
  287. padding-top: 10px;
  288. }
  289. .layui-form-xxk-ul {
  290. float: left;
  291. overflow: hidden;
  292. width: 36%;
  293. }
  294. .layui-form-xxk-ul li {
  295. float: left;
  296. width: 25%;
  297. height: 36px;
  298. line-height: 36px;
  299. text-align: center;
  300. cursor: pointer;
  301. font-size: 14px;
  302. }
  303. .layui-zhu {
  304. color: #BF0505;
  305. line-height: 23px;
  306. float: right;
  307. font-size: 14px;
  308. }
  309. .addxxkli {
  310. background: #fff;
  311. border-radius: 6px 6px 0 0;
  312. }
  313. .width94_ {
  314. width: 96%;
  315. }
  316. .wauto {
  317. margin: 0 auto;
  318. }
  319. .layui-xxk-body-box {
  320. clear: both;
  321. }
  322. .layui-xxk-bodys {
  323. margin-top: 20px;
  324. }
  325. .layui-xxk-bodys dd {
  326. display: none;
  327. border: 0;
  328. }
  329. .layui-form-select dl {
  330. width: 100% !important;
  331. }
  332. #symbshowed video {
  333. max-height: 400px;
  334. max-width: 100%;
  335. margin-top: 15px;
  336. }
  337. .center {
  338. text-align: center;
  339. }
  340. .vrBtnSelect {
  341. max-width: 100px;
  342. white-space: nowrap;
  343. padding: 0px 10px;
  344. height: 38px;
  345. background-color: #249EFB;
  346. color: #ffffff;
  347. text-align: center;
  348. line-height: 38px;
  349. border-radius: 4px;
  350. margin-left: 5px;
  351. cursor: pointer;
  352. }
  353. .flexBox {
  354. display: flex !important;
  355. }
  356. </style>
  357. <body>
  358. <div class="layui-fluid">
  359. <div class="layui-card">
  360. <div class="layui-card-body">
  361. <div class="layui-form">
  362. <input type="hidden" name="cate1" value='{$cate1}' />
  363. <input type="hidden" name="id" value='{$id}' />
  364. <div class="layui-form-item">
  365. <label class="layui-form-label textlh1"><i style="color:red;">*</i>标题</label>
  366. <div class="layui-input-inline" style="width: 200px;">
  367. <input class="layui-input inputBox" lay-verify="required" name="title" type="text"
  368. value="{$data.title}" placeholder="请输入标题" autocomplete="off">
  369. </div>
  370. </div>
  371. <div class="layui-form-item">
  372. <label class="layui-form-label"><span class="colorRed"
  373. style="color:red;margin-right:5px;"></span>分类</label>
  374. <div class="layui-input-inline">
  375. <select name="cate2" lay-filter="type" id="type" lay-search>
  376. <option value="">请选择分类</option>
  377. {volist name="type" id="t"}
  378. {if($t.title != '小区' && $t.title != '户型' && $t.title != '风格')}
  379. <option value="{$t.id}" {if condition='$data.cate2 eq $t.id' } selected {/if}>{$t.title}</option>
  380. {/if}
  381. {/volist}
  382. </select>
  383. </div>
  384. </div>
  385. <div class="layui-form-item">
  386. <label class="layui-form-label"><span class="colorRed"
  387. style="color:red;margin-right:5px;"></span>标签</label>
  388. <div class="layui-input-inline">
  389. <select name="cate3" id="label" lay-filter="type2">
  390. <option value="">请选择标签</option>
  391. <option value="{$cate3.id}" selected>{$cate3.title}</option>
  392. </select>
  393. </div>
  394. </div>
  395. <div class="layui-form-item">
  396. <label class="layui-form-label"><i style="color:red;"></i>面积</label>
  397. <div class="layui-input-inline" style="position: relative;width:200px;">
  398. <input type='text' onkeyup="RegularInt(this)" name="square" placeholder="请输入面积"
  399. class="layui-input input-indent-box" autocomplete="off" lay-verify="subject_add" value="{$data.square}">
  400. <span class="pingmi">平米</span>
  401. </div>
  402. </div>
  403. <div class="layui-form-item">
  404. <label class="layui-form-label"><span class="colorRed"
  405. style="color:red;margin-right:5px;"></span>设计师</label>
  406. <div class="layui-input-inline">
  407. <select name="designer_id" lay-filter="designer_id" id="designer_id"
  408. lay-search>
  409. <option value="">请选择设计师</option>
  410. {volist name="designer" id="t"}
  411. <option value="{$t.id}" {if condition='$data.designer_id eq $t.id' } selected {/if}>{$t.name}</option>
  412. {/volist}
  413. </select>
  414. </div>
  415. </div>
  416. <div class="layui-form-item">
  417. <label class="layui-form-label"><span class="colorRed"
  418. style="color:red;margin-right:5px;"></span>小区</label>
  419. <div class="layui-input-inline">
  420. <select name="community_id" lay-filter="community_id" id="community_id"
  421. lay-search>
  422. <option value="">请选择小区</option>
  423. {volist name="community" id="t"}
  424. <option value="{$t.id}" {if condition='$data.community_id eq $t.id' } selected {/if}>{$t.title}</option>
  425. {/volist}
  426. </select>
  427. </div>
  428. </div>
  429. <div class="layui-form-item">
  430. <label class="layui-form-label"><span class="colorRed"
  431. style="color:red;margin-right:5px;"></span>户型</label>
  432. <div class="layui-input-inline">
  433. <select name="housetype_id" lay-filter="housetype_id" id="housetype_id"
  434. lay-search>
  435. <option value="">请选择户型</option>
  436. {volist name="housetype" id="t"}
  437. <option value="{$t.id}" {if condition='$data.housetype_id eq $t.id' } selected {/if}>{$t.title}</option>
  438. {/volist}
  439. </select>
  440. </div>
  441. </div>
  442. <div class="layui-form-item">
  443. <label class="layui-form-label"><span class="colorRed"
  444. style="color:red;margin-right:5px;"></span>风格</label>
  445. <div class="layui-input-inline">
  446. <select name="decostyle_id" lay-filter="decostyle_id" id="decostyle_id"
  447. lay-search>
  448. <option value="">请选择风格</option>
  449. {volist name="decostyle" id="t"}
  450. <option value="{$t.id}" {if condition='$data.decostyle_id eq $t.id' } selected {/if}>{$t.title}</option>
  451. {/volist}
  452. </select>
  453. </div>
  454. </div>
  455. <div class="layui-form-item">
  456. <label class="layui-form-label">价格</label>
  457. <div class="layui-input-inline" style="position: relative;width:200px;">
  458. <input class="layui-input input-indent-box" onkeyup="RegularNum(this)" autocomplete="off" name="money"
  459. placeholder="请输入价格" type="text" value="{$data.money}" />
  460. <span class="pingmi">万起</span>
  461. </div>
  462. </div>
  463. <div class="layui-form-item" style="clear:both;width:100%;">
  464. <label class="layui-form-label"> 类别:</label>
  465. <div class="layui-input-block lh45 mdl20" style="max-width: 300px !important;">
  466. <input type="radio" class="radio_input" lay-filter="" name="type" value="0" title="推荐" {if
  467. condition='$data.type eq 0' } checked {/if}>
  468. <input type="radio" class="radio_input" lay-filter="" name="type" value="1" title="必看" {if
  469. condition='$data.type eq 1' } checked {/if}>
  470. </div>
  471. </div>
  472. <div class="layui-form-item" style="clear:both;width: 100%;">
  473. <label class="layui-form-label"><i style="color:red;">*</i>封面图</label>
  474. <div style="margin: 20px 20px 0px;">
  475. <div class="addImages" id="anlicoverimg">
  476. <div class="text-detail imageDiv">
  477. <img src="{$data.cover}?x-oss-process=image/resize,w_300"
  478. style="height: 100% !important;width: 100% !important;">
  479. </div>
  480. </div>
  481. </div>
  482. </div>
  483. <div class="layui-form-item" style="width: 100%;">
  484. <label class="layui-form-label"></label>
  485. <div><i style="color: red;margin-right:5px;">*</i>建议上传封面图宽高比例5:3,图片大小不超过1M</div>
  486. </div>
  487. <div class="layui-xxk-body-box">
  488. <div class="layui-form-xxkbg">
  489. <div class="width94_ wauto">
  490. <ul class="layui-form-xxk-ul">
  491. <li class="addxxkli">效果案例</li>
  492. <li>实景案例</li>
  493. <li>视频案例</li>
  494. <li>VR案例</li>
  495. </ul>
  496. <p class="layui-zhu">注:四种案例形式可同时展现</p>
  497. </div>
  498. </div>
  499. <dl class="layui-xxk-bodys">
  500. <dd style="display:block;">
  501. <div class="layui-form-item" style="clear:both;width:100%;">
  502. <label class="layui-form-label">描述</label>
  503. <div class="layui-input-block">
  504. <script id="anli_content1" name="desc" type="text/plain"
  505. style="height: 350px;">{:$data.desc}</script>
  506. </div>
  507. </div>
  508. </dd>
  509. <dd>
  510. <div class="layui-form-item" style="clear:both;width:100%;">
  511. <label class="layui-form-label">描述</label>
  512. <div class="layui-input-block">
  513. <script id="anli_content2" name="real_case" type="text/plain"
  514. style="height: 350px;">{:$data.real_case}</script>
  515. </div>
  516. </div>
  517. </dd>
  518. <dd>
  519. <div class="layui-form-item" style="clear:both;width:100%;">
  520. <label class="layui-form-label">选择视频</label>
  521. <div class="layui-input-block">
  522. <div class="layui-input-inline" style="width: 290px;display: block;"
  523. id="container">
  524. <a class="layui-btn btn layui-border-btn" id="selectfiles"
  525. href="javascript:void(0);">选择视频</a>
  526. <a class="layui-btn btn layui-border-btn" id="postfiles"
  527. href="javascript:void(0);">开始上传</a>
  528. <div id="ossfile"></div>
  529. <div id="symbshowed">
  530. {if condition='$data.video_case' }
  531. <video src="{$data.video_case}" controls="controls"></video>
  532. {/if}
  533. </div>
  534. <!--报错信息返回展示-->
  535. <pre id="console"></pre>
  536. <input type="hidden" value="{$data.video_case}" id="fileuri">
  537. <!--上传到OSS哪个文件下,在这里定义-->
  538. <input type="hidden" value="Video" id="category_name">
  539. </div>
  540. </div>
  541. </div>
  542. <div class="layui-form-item" style="clear:both;width:100%;">
  543. <label class="layui-form-label"><i style="color:red;">*</i> 视频格式:</label>
  544. <div class="layui-input-block lh45 mdl20" style="max-width: 300px !important;">
  545. <input type="radio" id="1" class="radio_input" lay-filter="video_type"
  546. name="video_format" value="0" title="竖屏" {if
  547. condition='$data.video_format eq 0' } checked {/if}>
  548. <input type="radio" id="2" class="radio_input" lay-filter="video_type"
  549. name="video_format" value="1" title="横屏" {if
  550. condition='$data.video_format eq 1' } checked {/if}>
  551. </div>
  552. </div>
  553. <div class="layui-form-item videolimit">
  554. <label class="layui-form-label"></label>
  555. <div><i style="color:red;margin-right:5px;">*</i><span
  556. id="limitVA">上传视频大小不超过280M</span>
  557. </div>
  558. </div>
  559. </dd>
  560. <dd>
  561. <div class="layui-form-item" style="clear:both;width:100%;">
  562. <label class="layui-form-label">VR链接:</label>
  563. <div class="layui-input-block flexBox">
  564. <input type="text" name="vr_case" value="{$data.vr_case}" placeholder="请输入VR链接"
  565. autocomplete="off" class="layui-input">
  566. <div class="vrBtnSelect">选择vr作品</div>
  567. </div>
  568. </div>
  569. </dd>
  570. </dl>
  571. </div>
  572. <div class="layui-form-item submit-btn" style="clear:both;">
  573. <input class="layui-btn layui-btn-primary " style="margin-left:110px;" type="button" lay-submit
  574. lay-filter="layuiadmin-anli-submit1" id="layuiadmin-anli-submit1" value="确认提交">
  575. </div>
  576. </div>
  577. </div>
  578. </div>
  579. </div>
  580. </body>
  581. {/block} {block name="js"}
  582. <script type="text/javascript">
  583. function RegularNum(obj) {
  584. obj.value = obj.value.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
  585. obj.value = obj.value.replace(/^\./g, ""); //验证第一个字符是数字
  586. obj.value = obj.value.replace(/\.{2,}/g, "."); //只保留第一个, 清除多余的
  587. obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
  588. obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入三个小数
  589. }
  590. function RegularInt(obj) {
  591. obj.value = obj.value.replace(/[^\d]/g, ""); //清除"数字以外的字符
  592. obj.value = obj.value.replace(/^\./g, ""); //验证第一个字符是数字
  593. }
  594. </script>
  595. <!-- 配置文件 -->
  596. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.config.js"></script>
  597. <!-- 编辑器源码文件 -->
  598. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.all.js"></script>
  599. <!-- 实例化编辑器 -->
  600. <script type="text/javascript">
  601. var ue = UE.getEditor('anli_content1');
  602. var ues = UE.getEditor('anli_content2');
  603. </script>
  604. <script type="text/javascript" src="__STATIC__/js/plupload/js/plupload.full.min.js"></script>
  605. <script type="text/javascript" src="__STATIC__/js/plupload/ossupload.js"></script>
  606. <script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.3.1.min.js" async></script>
  607. <script>
  608. layui.config({
  609. base: '__LAYUI__/' //静态资源所在路径
  610. ,
  611. urlbase: '/sys'
  612. }).extend({
  613. index: 'lib/index' //主入口模块
  614. }).use(['index', 'form', 'table', 'layedit', 'element', 'upload'], function () {
  615. var form = layui.form,
  616. layedit = layui.layedit,
  617. element = layui.element,
  618. upload = layui.upload,
  619. $ = layui.jquery;
  620. var files = '{$data.cover}';
  621. form.render();
  622. //案例添加保存
  623. form.on('submit(layuiadmin-anli-submit1)', function (data) {
  624. // if($('.imageDiv img').attr('src')== "" || $('.imageDiv img').attr('src')== undefined || $('.imageDiv img').attr('src')== null){
  625. // if (data.field.cover_img == "" || data.field.cover_img == null || data.field.cover_img == undefined) {
  626. // layer.msg('请选择封面图', { anim: 0, time: 1000, icon: 5 });
  627. // return false;
  628. // }
  629. // }
  630. if (files == "" || files == null || files == undefined) {
  631. layer.msg('请选择封面图', { anim: 0, time: 1000, icon: 5 });
  632. return false;
  633. }
  634. var formData = new FormData(data.form);
  635. ue.ready(function () {
  636. formData.append('desc', ue.getContent('anli_content1'));
  637. });
  638. ue.ready(function () {
  639. formData.append('real_case', ues.getContent('anli_content2'));
  640. });
  641. for(let key in data.field) {
  642. formData.append(key, data.field[key]);
  643. }
  644. formData.append('cover', files);
  645. formData.append('video_case',$('#fileuri').val());
  646. formData.append('vr_case',$('input[name=vr_case]').val());
  647. // 单击之后提交按钮不可选,防止重复提交
  648. var DISABLED = 'layui-btn-disabled';
  649. var target = '#layuiadmin-anli-submit';
  650. $(target).addClass(DISABLED);
  651. $(target).attr('disabled', 'disabled');
  652. $.ajax({
  653. url: '{:url("smartScreen/edits")}',
  654. type: 'post',
  655. data: formData,
  656. dataType: 'json',
  657. processData: false,
  658. contentType: false,
  659. success: function (res) {
  660. $(target).removeClass(DISABLED);
  661. $(target).removeAttr('disabled');
  662. if (res.code === 0) {
  663. localStorage.setItem('anlidata', '');
  664. layer.msg(res.msg, {
  665. anim: 0, time: 1000, icon: 6,
  666. }, function () {
  667. var index = parent.layer.getFrameIndex(window.name);
  668. parent.layer.close(index);
  669. parent.layui.table.reload('talkskill-table');
  670. });
  671. } else {
  672. layer.msg(res.msg, { anim: 0, time: 1000, icon: 5 });
  673. $(target).removeClass(DISABLED);
  674. $(target).removeAttr('disabled');
  675. }
  676. },
  677. error: function (e) {
  678. $(target).removeClass(DISABLED);
  679. $(target).removeAttr('disabled');
  680. }
  681. });
  682. return false;
  683. });
  684. //vr作品
  685. $('.vrBtnSelect').click(function(){
  686. let vrStr = $('input[name="vr_case"]').val();
  687. let vrSid = "";
  688. if (vrStr && ((vrStr.indexOf("saastest.zhuangqixiaoguan.com") > -1)||(vrStr.indexOf("h5.zqxg.cc") > -1))) {
  689. vrSid = vrStr.split("/#/")[1];
  690. }
  691. layer.open({
  692. type: 2,
  693. title: ['选择VR作品', 'color:#333333;background-color:#D8E6F1;'],
  694. content: '{:url("building/group")}?id='+vrSid,
  695. area: ['80%', '80%'],
  696. btn: ['确定', '取消'],
  697. yes: function (index, layero) {
  698. let data = layero.find('iframe').contents().find("#hiddentext").val();
  699. if (data) {
  700. let vrObject = JSON.parse(data);
  701. $('input[name="vr_case"]').val(vrObject.show_url);
  702. }
  703. layer.close(index);
  704. //点击确认触发 iframe 内容中的按钮提交
  705. }
  706. });
  707. })
  708. /*---------------------------------------------------------*/
  709. //案例封面图
  710. upload.render({
  711. elem: '#anlicoverimg',
  712. accept: 'images',
  713. url: '/upload/',
  714. exts: 'png|jpg|jpeg',
  715. field: 'file',
  716. size: 3 * 1024,
  717. auto: false,
  718. choose: function (obj) {
  719. length = $('.imageDiv').length;
  720. obj.preview(function (index, file, result) {
  721. var loadingIndex = layer.load('Loading...', {
  722. shade: [0.6,'#000'] //0.1透明度的白色背景
  723. });
  724. ossuploadimg(file).then(f => {
  725. layer.close(loadingIndex);
  726. files = `https://o.nczyzs.com/${f}`;
  727. $('#anlicoverimg').html('<div class="imageDiv" data-id="' + index + '"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img" width="100%" height="100%"><div class="iconwrapper"></div></div>');
  728. var idom = document.createElement('i');
  729. idom.classList.add("layui-icon", "layui-icon-delete");
  730. idom.addEventListener("click", function (e) {
  731. e.stopPropagation();
  732. var that = this;
  733. layer.confirm('确定删除该图片么?', function (index) {
  734. var imgDiv = $(that).closest('.imageDiv');
  735. if (id = imgDiv.data('id')) {
  736. files = '';
  737. }
  738. imgDiv.remove();
  739. $('#anlicoverimg').html('<div class="text-detail"><span>+</span><p>选择替换封面图</p></div>');
  740. layer.close(index);
  741. });
  742. });
  743. $('.iconwrapper').append(idom);
  744. })
  745. });
  746. },
  747. });
  748. function ossuploadimg(file) {
  749. return new Promise((resolve,reject) => {
  750. var client = new OSS({
  751. region: "oss-cn-hangzhou",
  752. accessKeyId: "LTAI5tHjWupJSCAycy2yVbQZ",
  753. accessKeySecret: "eNFicm77Cfq3u7ZnQyw1urFmFNpf3w",
  754. bucket: "zyzswzh",
  755. secure: true
  756. });
  757. var date = new Date().getTime();
  758. var objectName = 'SmartScreen/' + date + "/" + Date.now() + ".jpeg";
  759. client.put(objectName, file).then(function (result) {
  760. resolve(result.name);
  761. }).catch(function (error) {
  762. reject(error)
  763. });
  764. })
  765. }
  766. //切换
  767. $('.layui-form-xxk-ul li').click(function () {
  768. var n = $(this).index();
  769. $(this).addClass('addxxkli').siblings().removeClass('addxxkli');
  770. $('.layui-xxk-bodys dd').eq(n).show().siblings().hide();
  771. })
  772. //下拉框关联
  773. var typeData = JSON.parse('{$label|raw}');
  774. form.on('select(type)', function (data) {
  775. var typeJson = typeData[data.value];
  776. var typeLabel = $('#label');
  777. typeLabel.empty().append('<option value="">请选择标签</option>');
  778. for (r in typeJson) {
  779. typeLabel.append('<option value=' + r + '>' + typeJson[r] + '</option>');
  780. }
  781. form.render();
  782. });
  783. form.render();
  784. });
  785. </script>
  786. {/block}