create.php 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <!DOCTYPE html>
  2. <!--suppress JSAnnotator -->
  3. <html lang="zh-CN">
  4. <head>
  5. {include file="public/head"}
  6. <title>{$title}</title>
  7. </head>
  8. <body>
  9. <div id="form-add" class="mp-form" v-cloak="">
  10. <i-Form :model="formData" :label-width="80" >
  11. <Form-Item label="数据组名称">
  12. <i-input v-model="formData.name" placeholder="请输入数据组名称"></i-input>
  13. </Form-Item>
  14. <Form-Item label="数据字段">
  15. <i-input v-model="formData.config_name" placeholder="请输入数据字段例如:site_url"></i-input>
  16. </Form-Item>
  17. <Form-Item label="数据组简介">
  18. <i-input v-model="formData.info" placeholder="请输入数据组简介"></i-input>
  19. </Form-Item>
  20. <Form-Item v-for="(item, index) in formData.typelist" :label="'字段' + (index+1)">
  21. <row type="flex" ref="typelist" align="middle">
  22. <i-col span="10">
  23. <row>
  24. <i-col span="23">
  25. <Form-Item>
  26. <i-input :placeholder="item.name.placeholder" v-model="item.name.value"></i-input>
  27. </Form-Item>
  28. </i-col>
  29. </row>
  30. <row>
  31. <i-col span="23">
  32. <Form-Item>
  33. <i-input :placeholder="item.title.placeholder" v-model="item.title.value"></i-input>
  34. </Form-Item>
  35. </i-col>
  36. </row>
  37. <row>
  38. <i-col span="23">
  39. <Form-Item>
  40. <i-select :placeholder="item.type.placeholder" v-model="item.type.value">
  41. <i-option value="input">文本框</i-option>
  42. <i-option value="textarea">多行文本框</i-option>
  43. <i-option value="radio">单选框</i-option>
  44. <i-option value="checkbox">多选框</i-option>
  45. <i-option value="select">下拉选择</i-option>
  46. <i-option value="upload">单图</i-option>
  47. <i-option value="uploads">多图</i-option>
  48. <i-option value="number">数字</i-option>
  49. </i-select>
  50. </Form-Item>
  51. </i-col>
  52. </row>
  53. </i-col>
  54. <i-col span="12">
  55. <Form-Item>
  56. <i-input type="textarea" rows="4" :placeholder="item.param.placeholder" v-model="item.param.value"></i-input>
  57. </Form-Item>
  58. </i-col>
  59. <i-col span="2" style="display:inline-block; text-align:right;">
  60. <i-button type="primary" icon="close-round" @click="removeType(index)"></i-button>
  61. </i-col>
  62. </row>
  63. </row>
  64. </Form-Item>
  65. <Form-Item><i-button type="primary" @click="addType">添加字段</i-button></Form-Item>
  66. <Form-Item :class="'add-submit-item'">
  67. <i-Button :type="'primary'" :html-type="'submit'" :size="'large'" :long="true" @click.prevent="submit">提交</i-Button>
  68. </Form-Item>
  69. </i-Form>
  70. </div>
  71. <script>
  72. $eb = parent._mpApi;
  73. mpFrame.start(function(Vue){
  74. new Vue({
  75. el:"#form-add",
  76. data:{
  77. formData:{
  78. name: '',
  79. config_name: '',
  80. typelist: [],
  81. info:''
  82. }
  83. },
  84. methods:{
  85. addType: function(){
  86. this.formData.typelist.push({
  87. name: {
  88. placeholder: "字段名称:姓名",
  89. value: ''
  90. },
  91. title: {
  92. placeholder: "字段配置名:name",
  93. value: ''
  94. },
  95. type: {
  96. placeholder: "字段类型",
  97. value: ''
  98. },
  99. param: {
  100. placeholder: "参数方式例如:\n1=>白色\n2=>红色\n3=>黑色",
  101. value: ''
  102. }
  103. })
  104. },
  105. removeType: function(index){
  106. this.formData.typelist.splice(index,1);
  107. },
  108. submit: function(){
  109. $eb.axios.post("{$save}",this.formData).then((res)=>{
  110. if(res.status && res.data.code == 200)
  111. return Promise.resolve(res.data);
  112. else
  113. return Promise.reject(res.data.msg || '添加失败,请稍候再试!');
  114. }).then((res)=>{
  115. $eb.message('success',res.msg || '操作成功!');
  116. $eb.closeModalFrame(window.name);
  117. parent.$(".J_iframe:visible")[0].contentWindow.location.reload();
  118. }).catch((err)=>{
  119. this.loading=false;
  120. $eb.message('error',err);
  121. });
  122. }
  123. }
  124. });
  125. });
  126. </script>
  127. </body>