form.txt 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. <template>
  2. <view class="edit-wrap">
  3. <view class="edit-form">
  4. <u--form labelPosition="left" :model="form" labelWidth="90px" :rules="rules" ref="uForm">
  5. $foreach(column in genTable.Columns)
  6. $set(columnName = column.CsharpFieldFl)
  7. $set(value = "item.value")
  8. $set(number = "")
  9. $set(labelName = column.ColumnComment)
  10. $if(column.CsharpType == "int" || column.CsharpType == "long")
  11. $set(value = "parseInt(item.value)")
  12. $set(number = ".number")
  13. $end
  14. $if(column.IsPK || column.IsIncrement)
  15. $if(column.IsPK && column.IsIncrement == false && replaceDto.useSnowflakeId == false)
  16. <u-form-item label="${labelName}" prop="${columnName}">
  17. <u--input type="number" v-model.number="form.${columnName}" placeholder="请输入${labelName}" :disabled="opertype != 1"></u--input>
  18. </u-form-item>
  19. $else
  20. <u-form-item label="${labelName}" prop="${columnName}" v-if="opertype != 1">
  21. <u--input type="number" v-model.number="form.${columnName}" placeholder="请输入${labelName}" :disabled="true"/>
  22. </u-form-item>
  23. $end
  24. $else
  25. $if(column.HtmlType == "radio" || column.HtmlType == "selectRadio")
  26. <u-form-item label="${labelName}" prop="${columnName}">
  27. <u-radio-group v-model="form.${columnName}">
  28. <u-radio v-for="item in ${if(column.DictType != "")}dict.type.${column.DictType}${else}${column.CsharpFieldFl}Options$end" :name="${value}" class="margin-right-xl">{{item.label}}</u-radio>
  29. </u-radio-group>
  30. </u-form-item>
  31. $elseif(column.HtmlType == "checkbox")
  32. <u-form-item label="${labelName}" prop="${columnName}">
  33. <view class="">
  34. <u-checkbox-group v-model="form.${columnName}Checked">
  35. <u-checkbox :customStyle="{marginRight: '20px', marginBottom: '15px'}" v-for="(item, index) in ${if(column.DictType != "")}dict.type.${column.DictType}${else}${column.CsharpFieldFl}Options$end" :key="index"
  36. :label="item.label" :name="${value}">
  37. </u-checkbox>
  38. </u-checkbox-group>
  39. </view>
  40. </u-form-item>
  41. $elseif(column.HtmlType == "inputNumber" || column.HtmlType == "customInput")
  42. <u-form-item label="${labelName}" prop="${columnName}">
  43. <u-number-box v-model="form.${columnName}"></u-number-box>
  44. </u-form-item>
  45. $elseif(column.HtmlType == "datetime" || column.HtmlType == "month")
  46. <u-form-item label="${labelName}" prop="${columnName}">
  47. <uni-datetime-picker v-model="form.${columnName}" />
  48. </u-form-item>
  49. $elseif(column.HtmlType == "textarea")
  50. <u-form-item label="${labelName}" prop="${columnName}">
  51. <u--textarea v-model="form.${columnName}" placeholder="请输入内容" count ></u--textarea>
  52. </u-form-item>
  53. $elseif(column.HtmlType == "imageUpload" || column.HtmlType == "fileUpload")
  54. <u-form-item label="${labelName}" prop="${columnName}">
  55. <uploadImage v-model="form.${columnName}"></uploadImage>
  56. </u-form-item>
  57. $elseif(column.HtmlType == "select" || column.HtmlType == "selectMulti")
  58. <u-form-item label="${labelName}" prop="${columnName}">
  59. <uni-data-select v-model="form.${columnName}" :clear="true" :localdata="${if(column.DictType != "")}dict.type.${column.DictType}${else}${column.CsharpFieldFl}Options$end"
  60. format="{label} - {value}"></uni-data-select>
  61. </u-form-item>
  62. $else
  63. <u-form-item label="${labelName}" prop="${columnName}">
  64. <u--input v-model${number}="form.${columnName}" placeholder="请输入${labelName}" ${column.DisabledStr}/>
  65. </u-form-item>
  66. $end
  67. $end
  68. $end
  69. </u--form>
  70. </view>
  71. <view class="form-footer">
  72. <view class="btn_wrap">
  73. <view class="btn-item">
  74. <u-button text="取消" shape="circle" type="info" @click="handleCancel"></u-button>
  75. </view>
  76. <view class="btn-item" v-if="opertype != 3">
  77. <u-button text="确定" shape="circle" type="primary" @click="submit"></u-button>
  78. </view>
  79. </view>
  80. </view>
  81. </view>
  82. </template>
  83. <script>
  84. import {
  85. get${genTable.BusinessName},
  86. $if(replaceDto.ShowBtnAdd)
  87. add${genTable.BusinessName},
  88. $end
  89. $if(replaceDto.ShowBtnEdit)
  90. update${genTable.BusinessName},
  91. $end
  92. } from '@/api/${tool.FirstLowerCase(genTable.ModuleName)}/${genTable.BusinessName.ToLower()}.js'
  93. export default {
  94. dicts: [
  95. $foreach(item in genTable.Columns)
  96. $if((item.HtmlType == "radio" || item.HtmlType.Contains("select") || item.HtmlType == "checkbox") && item.DictType != "")
  97. "${item.DictType}",
  98. $end
  99. $end
  100. ],
  101. data() {
  102. return {
  103. form: {
  104. $foreach(item in genTable.Columns)
  105. $if(item.HtmlType == "checkbox")
  106. ${item.CsharpFieldFl}Checked: [],
  107. $else
  108. $item.CsharpFieldFl: undefined,
  109. $end
  110. $end
  111. },
  112. rules: {
  113. $foreach(column in genTable.Columns)
  114. $if(column.IsRequired && column.IsIncrement == false)
  115. ${column.CsharpFieldFl}: [{
  116. required: true,
  117. message: "${column.ColumnComment}不能为空",
  118. trigger: [ 'change', 'blur' ],
  119. $if(column.CsharpType == "int" || column.CsharpType == "long") type: "number"$end
  120. }],
  121. $end
  122. $end
  123. },
  124. opertype: 0,
  125. $foreach(item in genTable.Columns)
  126. $if((item.HtmlType == "radio" || item.HtmlType == "select" || item.HtmlType == "checkbox") && item.DictType == "")
  127. // ${item.ColumnComment}选项列表 格式 eg:{ label: '标签', value: '0'}
  128. ${item.CsharpFieldFl}Options: [],
  129. $end
  130. $end
  131. }
  132. },
  133. onReady() {
  134. // 需要在onReady中设置规则
  135. setTimeout(() => {
  136. this.${refs}refs.uForm.setRules(this.rules)
  137. }, 300)
  138. },
  139. onLoad(e) {
  140. this.opertype = e.opertype
  141. if (e.id) {
  142. get${genTable.BusinessName}(e.id).then(res => {
  143. const {
  144. code,
  145. data
  146. } = res
  147. if (code == 200) {
  148. this.form = {
  149. ...data,
  150. $foreach(item in genTable.Columns)
  151. $if(item.HtmlType == "checkbox")
  152. ${item.CsharpFieldFl}Checked: data.${item.CsharpFieldFl} ? data.${item.CsharpFieldFl}.split(',') : [],
  153. $end
  154. $end
  155. }
  156. }
  157. })
  158. } else {
  159. this.reset()
  160. }
  161. },
  162. methods: {
  163. reset(){
  164. this.form = {
  165. $foreach(item in genTable.Columns)
  166. $if((item.HtmlType == "checkbox"))
  167. ${item.CsharpFieldFl}Checked: [],
  168. $else
  169. $item.CsharpFieldFl: undefined,
  170. $end
  171. $end
  172. };
  173. },
  174. submit() {
  175. this.${refs}refs.uForm.validate().then(res => {
  176. this.${modal}modal.msg('表单校验通过')
  177. $foreach(item in genTable.Columns)
  178. $if(item.HtmlType == "checkbox")
  179. this.form.${item.CsharpFieldFl} = this.form.${item.CsharpFieldFl}Checked.toString();
  180. $end
  181. $end
  182. if (this.form.${replaceDto.FistLowerPk} != undefined && this.opertype == 2) {
  183. update${genTable.BusinessName}(this.form).then((res) => {
  184. this.${modal}modal.msgSuccess("修改成功")
  185. })
  186. } else {
  187. add${genTable.BusinessName}(this.form).then((res) => {
  188. this.${modal}modal.msgSuccess("新增成功")
  189. })
  190. }
  191. }).catch(errors => {
  192. this.${modal}modal.msg('表单校验失败')
  193. })
  194. },
  195. handleCancel() {
  196. uni.navigateBack()
  197. }
  198. }
  199. }
  200. </script>
  201. <style lang="scss" scoped>
  202. @import "@/static/scss/page.scss";
  203. .btn-wrap {
  204. margin: 150rpx auto 0 auto;
  205. width: 80%
  206. }
  207. </style>