edit.html 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. <form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
  2. <div class="form-group">
  3. <label class="control-label col-xs-12 col-sm-2">{:__('用户昵称')}:</label>
  4. <div class="col-xs-12 col-sm-8">
  5. <input id="c-user_id" data-rule="required" data-source="user/user/index" data-order-by="id desc" data-field="nickname" data-format-item="[{id}]-[{nickname}]" class="form-control selectpage" name="row[user_id]" type="text" value="{$row.user_id|htmlentities}">
  6. </div>
  7. </div>
  8. <div class="form-group">
  9. <label class="control-label col-xs-12 col-sm-2">{:__('礼物ID')}:</label>
  10. <div class="col-xs-12 col-sm-8">
  11. <input id="c-gift_id" data-rule="required" min="0" data-source="gift/gift/index" data-order-by="id desc" data-format-item="[{id}]-[{name}]" class="form-control selectpage" name="row[gift_id]" type="text" value="{$row.gift_id|htmlentities}">
  12. </div>
  13. </div>
  14. <!--<div class="form-group">
  15. <label class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
  16. <div class="col-xs-12 col-sm-8">
  17. <input id="c-name" data-rule="required" readonly class="form-control" name="row[name]" type="text" value="{$row.name|htmlentities}">
  18. </div>
  19. </div>
  20. <div class="form-group">
  21. <label class="control-label col-xs-12 col-sm-2">{:__('Image')}:</label>
  22. <div class="col-xs-12 col-sm-8">
  23. <div class="input-group">
  24. <input id="c-image" data-rule="required" readonly class="form-control" size="50" name="row[image]" type="text" value="{$row.image|htmlentities}">
  25. <div class="input-group-addon no-border no-padding">
  26. <span><button type="button" id="faupload-image" class="btn btn-danger faupload" data-input-id="c-image" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  27. <span><button type="button" id="fachoose-image" class="btn btn-primary fachoose" data-input-id="c-image" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
  28. </div>
  29. <span class="msg-box n-right" for="c-image"></span>
  30. </div>
  31. <ul class="row list-inline faupload-preview" id="p-image"></ul>
  32. </div>
  33. </div>
  34. <div class="form-group">
  35. <label class="control-label col-xs-12 col-sm-2">{:__('Gif_image')}:</label>
  36. <div class="col-xs-12 col-sm-8">
  37. <div class="input-group">
  38. <input id="c-gif_image" class="form-control" readonly size="50" name="row[gif_image]" type="text" value="{$row.gif_image|htmlentities}">
  39. <div class="input-group-addon no-border no-padding">
  40. <span><button type="button" id="faupload-gif_image" class="btn btn-danger faupload" data-input-id="c-gif_image" data-mimetype="svga" data-multiple="false" data-preview-id="p-gif_image"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
  41. <span><button type="button" id="fachoose-gif_image" class="btn btn-primary fachoose" data-input-id="c-gif_image" data-mimetype="file/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
  42. </div>
  43. <span class="msg-box n-right" for="c-gif_image"></span>
  44. </div>
  45. <ul class="row list-inline faupload-preview" id="p-gif_image"></ul>
  46. <div style="padding:2px 33px;margin-top:10px;width:120px;color:#fff3f6;cursor:pointer;background-color: #00A000;border-radius: 2px;" onclick="play()">播放动画</div>
  47. </div>
  48. </div>
  49. <div class="form-group">
  50. <label class="control-label col-xs-12 col-sm-2">{:__('Value')}:</label>
  51. <div class="col-xs-12 col-sm-8">
  52. <input id="c-value" data-rule="required" readonly class="form-control" name="row[value]" type="number" value="{$row.value|htmlentities}">
  53. </div>
  54. </div>
  55. <div class="form-group">
  56. <label class="control-label col-xs-12 col-sm-2">{:__('Number')}:</label>
  57. <div class="col-xs-12 col-sm-8">
  58. <input id="c-number" class="form-control" name="row[number]" disabled type="number" value="{$row.number|htmlentities}">
  59. </div>
  60. </div>-->
  61. <!--<div class="form-group">
  62. <label class="control-label col-xs-12 col-sm-2">{:__('Is_use')}:</label>
  63. <div class="col-xs-12 col-sm-8">
  64. <select id="c-is_use" data-rule="required" class="form-control selectpicker" name="row[is_use]">
  65. {foreach name="isUseList" item="vo"}
  66. <option value="{$key}" {in name="key" value="$row.is_use"}selected{/in}>{$vo}</option>
  67. {/foreach}
  68. </select>
  69. </div>
  70. </div>
  71. <div class="form-group">
  72. <label class="control-label col-xs-12 col-sm-2">{:__('Use_time')}:</label>
  73. <div class="col-xs-12 col-sm-8">
  74. <input id="c-use_time" class="form-control datetimepicker" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" name="row[use_time]" type="text" value="{:$row.use_time?datetime($row.use_time):''}">
  75. </div>
  76. </div>-->
  77. <div class="form-group">
  78. <label class="control-label col-xs-12 col-sm-2">{:__('Get_way')}:</label>
  79. <div class="col-xs-12 col-sm-8">
  80. <select id="c-get_way" class="form-control selectpicker" readonly name="row[get_way]">
  81. {foreach name="getWayList" item="vo"}
  82. <option value="{$key}" {in name="key" value="$row.get_way"}selected{/in}>{$vo}</option>
  83. {/foreach}
  84. </select>
  85. </div>
  86. </div>
  87. <div class="form-group layer-footer">
  88. <label class="control-label col-xs-12 col-sm-2"></label>
  89. <div class="col-xs-12 col-sm-8">
  90. <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
  91. <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
  92. </div>
  93. </div>
  94. </form>
  95. <style>
  96. #demoCanvas{
  97. width: 100px;
  98. height: 80px;
  99. }
  100. </style>
  101. <script src="/assets/js/svga.min.js" ></script>
  102. <script>
  103. // 播放
  104. function play() {
  105. $("#p-gif_image li a.thumbnail").html("<div id='demoCanvas'></div>");
  106. var player = new SVGA.Player('#demoCanvas');
  107. player.loops=1;
  108. player.clearsAfterStop=false;
  109. var parser = new SVGA.Parser('#demoCanvas'); // 如果你需要支持 IE6+,那么必须把同样的选择器传给 Parser。
  110. var svgaUrl = $("#c-gif_image").val();
  111. if(svgaUrl.indexOf("http://") == -1 && svgaUrl.indexOf("https://") == -1) {
  112. svgaUrl = "{$Think.config.cos.url}"+svgaUrl;
  113. }
  114. parser.load(svgaUrl, function(videoItem) {
  115. player.setVideoItem(videoItem);
  116. player.startAnimation();
  117. })
  118. }
  119. </script>