cd3cb93badc08d18ed1418cdc81571d84ea8d484.svn-base 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530
  1. <#include "/common/utils.ftl">
  2. <template>
  3. <a-spin :spinning="confirmLoading">
  4. <j-form-container :disabled="formDisabled">
  5. <!-- 主表单区域 -->
  6. <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
  7. <a-row>
  8. <#assign form_popup = false>
  9. <#assign form_cat_tree = false>
  10. <#assign form_cat_back = "">
  11. <#assign bpm_flag=false>
  12. <#assign form_span = 24>
  13. <#list columns as po>
  14. <#if po.fieldDbName=='bpm_status'>
  15. <#assign bpm_flag=true>
  16. </#if>
  17. <#if po.isShow =='Y' && po.fieldName != 'id'>
  18. <#assign form_field_dictCode="">
  19. <#if po.dictTable?default("")?trim?length gt 1 && po.dictText?default("")?trim?length gt 1 && po.dictField?default("")?trim?length gt 1>
  20. <#assign form_field_dictCode="${po.dictTable},${po.dictText},${po.dictField}">
  21. <#elseif po.dictField?default("")?trim?length gt 1>
  22. <#assign form_field_dictCode="${po.dictField}">
  23. </#if>
  24. <#if po.classType =='textarea'>
  25. <a-col :span="24">
  26. <a-form-model-item label="${po.filedComment}" :labelCol="labelCol2" :wrapperCol="wrapperCol2" prop="${autoStringSuffixForModel(po)}">
  27. <#else>
  28. <a-col :xs="24" :sm="12">
  29. <a-form-model-item label="${po.filedComment}" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="${autoStringSuffixForModel(po)}">
  30. </#if>
  31. <#if po.classType =='date'>
  32. <j-date placeholder="请选择${po.filedComment}" v-model="model.${po.fieldName}" style="width: 100%" <#if po.readonly=='Y'>disabled</#if>/>
  33. <#elseif po.classType =='datetime'>
  34. <j-date placeholder="请选择${po.filedComment}" v-model="model.${po.fieldName}" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" style="width: 100%" <#if po.readonly=='Y'>disabled</#if>/>
  35. <#elseif po.classType =='time'>
  36. <j-time placeholder="请选择${po.filedComment}" v-model="model.${po.fieldName}" style="width: 100%" <#if po.readonly=='Y'>disabled</#if>/>
  37. <#elseif po.classType =='popup'>
  38. <#assign form_popup=true>
  39. <j-popup
  40. v-model="model.${po.fieldName}"
  41. field="${po.fieldName}"
  42. org-fields="${po.dictField}"
  43. dest-fields="${Format.underlineToHump(po.dictText)}"
  44. code="${po.dictTable}"
  45. :multi="${po.extendParams.popupMulti?c}"
  46. @input="popupCallback"
  47. <#if po.readonly=='Y'>disabled</#if>/>
  48. <#elseif po.classType =='sel_depart'>
  49. <j-select-depart v-model="model.${po.fieldName}" multi <#if po.readonly=='Y'>disabled</#if>/>
  50. <#elseif po.classType =='switch'>
  51. <j-switch v-model="model.${po.fieldName}" <#if po.dictField!= 'is_open'>:options="${po.dictField}"</#if> <#if po.readonly=='Y'>disabled</#if>></j-switch>
  52. <#elseif po.classType =='pca'>
  53. <j-area-linkage type="cascader" v-model="model.${po.fieldName}" placeholder="请输入省市区" <#if po.readonly=='Y'>disabled</#if>/>
  54. <#elseif po.classType =='markdown'>
  55. <j-markdown-editor v-model="model.${autoStringSuffixForModel(po)}" id="${po.fieldName}"></j-markdown-editor>
  56. <#elseif po.classType =='password'>
  57. <a-input-password v-model="model.${po.fieldName}" placeholder="请输入${po.filedComment}" <#if po.readonly=='Y'>disabled</#if>/>
  58. <#elseif po.classType =='sel_user'>
  59. <j-select-user-by-dep v-model="model.${po.fieldName}" <#if po.readonly=='Y'>disabled</#if>/>
  60. <#elseif po.classType =='textarea'>
  61. <a-textarea v-decorator="[${autoStringSuffix(po)}${autoWriteRules(po)}]" rows="4" placeholder="请输入${po.filedComment}" <#if po.readonly=='Y'>disabled</#if>/>
  62. <#elseif po.classType=='list' || po.classType=='radio'>
  63. <j-dict-select-tag type="${po.classType}" v-model="model.${po.fieldName}" dictCode="${form_field_dictCode}" placeholder="请选择${po.filedComment}" <#if po.readonly=='Y'>disabled</#if>/>
  64. <#elseif po.classType=='list_multi' || po.classType=='checkbox'>
  65. <j-multi-select-tag type="${po.classType}" v-model="model.${po.fieldName}" dictCode="${form_field_dictCode}" placeholder="请选择${po.filedComment}" <#if po.readonly=='Y'>disabled</#if>/>
  66. <#elseif po.classType=='sel_search'>
  67. <j-search-select-tag v-model="model.${po.fieldName}" dict="${form_field_dictCode}" <#if po.readonly=='Y'>disabled</#if>/>
  68. <#elseif po.classType=='cat_tree'>
  69. <#assign form_cat_tree = true>
  70. <j-category-select v-model="model.${po.fieldName}" pcode="${po.dictField?default("")}" placeholder="请选择${po.filedComment}" <#if po.dictText?default("")?trim?length gt 1>back="${dashedToCamel(po.dictText)}" @change="handleCategoryChange"</#if> <#if po.readonly=='Y'>disabled</#if>/>
  71. <#if po.dictText?default("")?trim?length gt 1>
  72. <#assign form_cat_back = "${po.dictText}">
  73. </#if>
  74. <#elseif po.fieldDbType=='int' || po.fieldDbType=='double' || po.fieldDbType=='BigDecimal'>
  75. <a-input-number v-model="model.${po.fieldName}" placeholder="请输入${po.filedComment}" style="width: 100%" <#if po.readonly=='Y'>disabled</#if>/>
  76. <#elseif po.classType=='file'>
  77. <j-upload v-model="model.${po.fieldName}" <#if po.readonly=='Y'>disabled</#if> <#if po.uploadnum??>:number=${po.uploadnum}</#if>></j-upload>
  78. <#elseif po.classType=='image'>
  79. <j-image-upload isMultiple <#if po.uploadnum??>:number=${po.uploadnum}</#if> v-model="model.${po.fieldName}" <#if po.readonly=='Y'>disabled</#if>></j-image-upload>
  80. <#elseif po.classType=='umeditor'>
  81. <j-editor v-model="model.${autoStringSuffixForModel(po)}" <#if po.readonly=='Y'>disabled</#if>/>
  82. <#elseif po.classType == 'sel_tree'>
  83. <j-tree-select
  84. ref="treeSelect"
  85. placeholder="请选择${po.filedComment}"
  86. v-model="model.${po.fieldName}"
  87. <#if po.dictText??>
  88. <#if po.dictText?split(',')[2]?? && po.dictText?split(',')[0]??>
  89. dict="${po.dictTable},${po.dictText?split(',')[2]},${po.dictText?split(',')[0]}"
  90. <#elseif po.dictText?split(',')[1]??>
  91. pidField="${po.dictText?split(',')[1]}"
  92. <#elseif po.dictText?split(',')[3]??>
  93. hasChildField="${po.dictText?split(',')[3]}"
  94. </#if>
  95. </#if>
  96. pidValue="${po.dictField}"
  97. <#if po.readonly=='Y'>disabled</#if>>
  98. </j-tree-select>
  99. <#else>
  100. <a-input v-model="model.${autoStringSuffixForModel(po)}" placeholder="请输入${po.filedComment}" <#if po.readonly=='Y'>disabled</#if>></a-input>
  101. </#if>
  102. </a-form-model-item>
  103. </a-col>
  104. </#if>
  105. </#list>
  106. </a-row>
  107. </a-form-model>
  108. </j-form-container>
  109. <!-- 子表单区域 -->
  110. <a-tabs v-model="activeKey" @change="handleChangeTabs">
  111. <#list subTables as sub><#rt/>
  112. <#if sub.foreignRelationType =='1'>
  113. <a-tab-pane tab="${sub.ftlDescription}" :key="refKeys[${sub_index}]" :forceRender="true">
  114. <${Format.humpToShortbar(sub.entityName)}-form ref="${sub.entityName?uncap_first}Form" @validateError="validateError" :disabled="formDisabled"></${Format.humpToShortbar(sub.entityName)}-form>
  115. </a-tab-pane>
  116. <#else>
  117. <a-tab-pane tab="${sub.ftlDescription}" :key="refKeys[${sub_index}]" :forceRender="true">
  118. <j-editable-table
  119. :ref="refKeys[${sub_index}]"
  120. :loading="${sub.entityName?uncap_first}Table.loading"
  121. :columns="${sub.entityName?uncap_first}Table.columns"
  122. :dataSource="${sub.entityName?uncap_first}Table.dataSource"
  123. :maxHeight="300"
  124. :disabled="formDisabled"
  125. :rowNumber="true"
  126. :rowSelection="true"
  127. :actionButton="true"/>
  128. </a-tab-pane>
  129. </#if>
  130. </#list>
  131. </a-tabs>
  132. <#if bpm_flag>
  133. <a-row v-if="showFlowSubmitButton" style="text-align: center;width: 100%;margin-top: 16px;"><a-button @click="handleOk">提 交</a-button></a-row>
  134. </#if>
  135. </a-spin>
  136. </template>
  137. <script>
  138. import { FormTypes,getRefPromise,VALIDATE_NO_PASSED } from '@/utils/JEditableTableUtil'
  139. import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
  140. import { validateDuplicateValue } from '@/utils/util'
  141. <#list subTables as sub>
  142. <#if sub.foreignRelationType =='1'>
  143. import ${sub.entityName}Form from './${sub.entityName}Form.vue'
  144. </#if>
  145. </#list>
  146. export default {
  147. name: '${entityName}Form',
  148. mixins: [JEditableTableModelMixin],
  149. components: {
  150. <#list subTables as sub>
  151. <#if sub.foreignRelationType =='1'>
  152. ${sub.entityName}Form,
  153. </#if>
  154. </#list>
  155. },
  156. data() {
  157. return {
  158. labelCol: {
  159. xs: { span: 24 },
  160. sm: { span: 6 },
  161. },
  162. wrapperCol: {
  163. xs: { span: 24 },
  164. sm: { span: 16 },
  165. },
  166. labelCol2: {
  167. xs: { span: 24 },
  168. sm: { span: 3 },
  169. },
  170. wrapperCol2: {
  171. xs: { span: 24 },
  172. sm: { span: 20 },
  173. },
  174. model:{
  175. <#include "/common/init/initValue.ftl">
  176. },
  177. <#include "/common/validatorRulesTemplate/main.ftl">
  178. // 新增时子表默认添加几行空数据
  179. addDefaultRowNum: 1,
  180. refKeys: [<#list subTables as sub>'${sub.entityName?uncap_first}', </#list>],
  181. tableKeys:[<#list subTables as sub><#if sub.foreignRelationType =='0'>'${sub.entityName?uncap_first}', </#if></#list>],
  182. activeKey: '${subTables[0].entityName?uncap_first}',
  183. <#list subTables as sub><#rt/>
  184. // ${sub.ftlDescription}
  185. ${sub.entityName?uncap_first}Table: {
  186. loading: false,
  187. dataSource: [],
  188. columns: [
  189. <#if sub.foreignRelationType =='0'>
  190. <#assign popupBackFields = "">
  191. <#-- 循环子表的列 开始 -->
  192. <#list sub.colums as col><#rt/>
  193. <#if col.isShow =='Y'>
  194. <#if col.filedComment !='外键' >
  195. {
  196. title: '${col.filedComment}',
  197. key: '${autoStringSuffixForModel(col)}',
  198. <#if col.classType =='date'>
  199. type: FormTypes.date,
  200. <#if col.readonly=='Y'>
  201. disabled:true,
  202. </#if>
  203. <#elseif col.classType =='datetime'>
  204. type: FormTypes.datetime,
  205. <#if col.readonly=='Y'>
  206. disabled:true,
  207. </#if>
  208. <#elseif "int,decimal,double,"?contains(col.classType)>
  209. type: FormTypes.inputNumber,
  210. <#if col.readonly=='Y'>
  211. disabled:true,
  212. </#if>
  213. <#elseif col.classType =='list' || col.classType =='radio'>
  214. type: FormTypes.select,
  215. <#if col.dictTable?default("")?trim?length gt 1>
  216. dictCode:"${col.dictTable},${col.dictText},${col.dictField}",
  217. <#else>
  218. dictCode:"${col.dictField}",
  219. </#if>
  220. <#if col.readonly=='Y'>
  221. disabled:true,
  222. </#if>
  223. <#elseif col.classType =='list_multi' || col.classType =='checkbox'>
  224. type: FormTypes.list_multi,
  225. <#if col.dictTable?default("")?trim?length gt 1>
  226. dictCode:"${col.dictTable},${col.dictText},${col.dictField}",
  227. <#else>
  228. dictCode:"${col.dictField}",
  229. </#if>
  230. <#if col.readonly=='Y'>
  231. disabled:true,
  232. </#if>
  233. <#elseif col.classType =='switch'>
  234. type: FormTypes.checkbox,
  235. <#if col.dictField == 'is_open'>
  236. customValue: ['Y', 'N'],
  237. <#else>
  238. customValue: ${col.dictField},
  239. </#if>
  240. <#if col.readonly=='Y'>
  241. disabled:true,
  242. </#if>
  243. <#elseif col.classType =='sel_search'>
  244. type: FormTypes.sel_search,
  245. <#if col.dictTable?default("")?trim?length gt 1>
  246. dictCode:"${col.dictTable},${col.dictText},${col.dictField}",
  247. <#else>
  248. dictCode:"${col.dictField}",
  249. </#if>
  250. <#if col.readonly=='Y'>
  251. disabled:true,
  252. </#if>
  253. <#elseif col.classType =='image'>
  254. type: FormTypes.image,
  255. token:true,
  256. responseName:"message",
  257. <#if col.readonly=='Y'>
  258. disabled:true,
  259. </#if>
  260. <#if col.uploadnum??>
  261. number: ${col.uploadnum},
  262. </#if>
  263. <#elseif col.classType =='file'>
  264. type: FormTypes.file,
  265. token:true,
  266. responseName:"message",
  267. <#if col.readonly=='Y'>
  268. disabled:true,
  269. </#if>
  270. <#if col.uploadnum??>
  271. number: ${col.uploadnum},
  272. </#if>
  273. <#elseif col.classType =='popup'>
  274. <#if popupBackFields?length gt 0>
  275. <#assign popupBackFields = "${popupBackFields}"+","+"${col.dictText}">
  276. <#else>
  277. <#assign popupBackFields = "${col.dictText}">
  278. </#if>
  279. type: FormTypes.popup,
  280. popupCode:"${col.dictTable}",
  281. destFields:"${col.dictText}",
  282. orgFields:"${col.dictField}",
  283. <#if col.readonly=='Y'>
  284. disabled:true,
  285. </#if>
  286. <#else>
  287. type: FormTypes.input,
  288. <#if col.readonly=='Y'>
  289. disabled:true,
  290. </#if>
  291. </#if>
  292. <#if col.classType =='list_multi' || col.classType =='checkbox'>
  293. width:"250px",
  294. <#else>
  295. width:"200px",
  296. </#if>
  297. <#if col.classType =='file'>
  298. placeholder: '请选择文件',
  299. <#else>
  300. placeholder: '请输入${'$'}{title}',
  301. </#if>
  302. <#if col.defaultVal??>
  303. <#if col.fieldDbType=="BigDecimal" || col.fieldDbType=="double" || col.fieldDbType=="int">
  304. defaultValue:${col.defaultVal},
  305. <#else>
  306. defaultValue:"${col.defaultVal}",
  307. </#if>
  308. <#else>
  309. defaultValue:'',
  310. </#if>
  311. <#-- 子表的校验 -->
  312. <#assign subFieldValidType = col.fieldValidType!''>
  313. <#-- 非空校验 -->
  314. <#if col.nullable == 'N' || subFieldValidType == '*'>
  315. validateRules: [{ required: true, message: '${'$'}{title}不能为空' }],
  316. <#-- 其他情况下,只要有值就被认为是正则校验 -->
  317. <#elseif subFieldValidType?length gt 0>
  318. <#assign subMessage = '格式不正确'>
  319. <#if subFieldValidType == 'only' >
  320. <#assign subMessage = '不能重复'>
  321. </#if>
  322. validateRules: [{ pattern: "${subFieldValidType}", message: "${'$'}{title}${subMessage}" }],
  323. </#if>
  324. },
  325. </#if>
  326. </#if>
  327. </#list>
  328. <#-- 循环子表的列 结束 -->
  329. <#-- 处理popup的隐藏列 -->
  330. <#if popupBackFields?length gt 0>
  331. <#list popupBackFields?split(",") as item>
  332. <#if item?length gt 0>
  333. <#assign tempItemFlag = true>
  334. <#list sub.colums as col>
  335. <#if col.isShow =='Y' && col.fieldName == item>
  336. <#assign tempItemFlag = false>
  337. </#if>
  338. </#list>
  339. <#if tempItemFlag>
  340. {
  341. title: '${item}',
  342. key: '${item}',
  343. type:"hidden"
  344. },
  345. </#if>
  346. </#if>
  347. </#list>
  348. </#if>
  349. </#if>
  350. ]
  351. },
  352. </#list>
  353. url: {
  354. add: "/${entityPackage}/${entityName?uncap_first}/add",
  355. edit: "/${entityPackage}/${entityName?uncap_first}/edit",
  356. <#list subTables as sub><#rt/>
  357. ${sub.entityName?uncap_first}: {
  358. list: '/${entityPackage}/${entityName?uncap_first}/query${sub.entityName}ByMainId'
  359. },
  360. </#list>
  361. }
  362. }
  363. },
  364. props: {
  365. <#if bpm_flag>
  366. //流程表单data
  367. formData: {
  368. type: Object,
  369. default: ()=>{},
  370. required: false
  371. },
  372. //表单模式:false流程表单 true普通表单
  373. formBpm: {
  374. type: Boolean,
  375. default: false,
  376. required: false
  377. },
  378. </#if>
  379. //表单禁用
  380. disabled: {
  381. type: Boolean,
  382. default: false,
  383. required: false
  384. }
  385. },
  386. computed: {
  387. formDisabled(){
  388. <#if bpm_flag>
  389. if(this.formBpm===true){
  390. if(this.formData.disabled===false){
  391. return false
  392. }
  393. return true
  394. }
  395. </#if>
  396. return this.disabled
  397. },
  398. <#if bpm_flag>
  399. showFlowSubmitButton(){
  400. if(this.formBpm===true){
  401. if(this.formData.disabled===false){
  402. return true
  403. }
  404. }
  405. return false
  406. }
  407. </#if>
  408. },
  409. created () {
  410. <#if bpm_flag>
  411. //如果是流程中表单,则需要加载流程表单data
  412. this.showFlowData();
  413. </#if>
  414. },
  415. methods: {
  416. addBefore(){
  417. <#list subTables as sub><#rt/>
  418. <#if sub.foreignRelationType =='1'>
  419. this.$refs.${sub.entityName?uncap_first}Form.clearFormData()
  420. <#else>
  421. this.${sub.entityName?uncap_first}Table.dataSource=[]
  422. </#if>
  423. </#list>
  424. },
  425. getAllTable() {
  426. let values = this.tableKeys.map(key => getRefPromise(this, key))
  427. return Promise.all(values)
  428. },
  429. /** 调用完edit()方法之后会自动调用此方法 */
  430. editAfter() {
  431. this.$nextTick(() => {
  432. <#list subTables as sub><#rt/>
  433. <#if sub.foreignRelationType =='1'>
  434. this.$refs.${sub.entityName?uncap_first}Form.initFormData(this.url.${sub.entityName?uncap_first}.list,this.model.id)
  435. </#if>
  436. </#list>
  437. })
  438. // 加载子表数据
  439. if (this.model.id) {
  440. let params = { id: this.model.id }
  441. <#list subTables as sub><#rt/>
  442. <#if sub.foreignRelationType =='0'>
  443. this.requestSubTableData(this.url.${sub.entityName?uncap_first}.list, params, this.${sub.entityName?uncap_first}Table)
  444. </#if>
  445. </#list>
  446. }
  447. },
  448. //校验所有一对一子表表单
  449. validateSubForm(allValues){
  450. return new Promise((resolve,reject)=>{
  451. Promise.all([
  452. <#list subTables as sub><#rt/>
  453. <#if sub.foreignRelationType =='1'>
  454. this.$refs.${sub.entityName?uncap_first}Form.validate(${sub_index}),
  455. </#if>
  456. </#list>
  457. ]).then(() => {
  458. resolve(allValues)
  459. }).catch(e => {
  460. if (e.error === VALIDATE_NO_PASSED) {
  461. // 如果有未通过表单验证的子表,就自动跳转到它所在的tab
  462. this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
  463. } else {
  464. console.error(e)
  465. }
  466. })
  467. })
  468. },
  469. /** 整理成formData */
  470. classifyIntoFormData(allValues) {
  471. let main = Object.assign(this.model, allValues.formValue)
  472. return {
  473. ...main, // 展开
  474. <#assign subManyIndex = 0>
  475. <#list subTables as sub><#rt/>
  476. <#if sub.foreignRelationType =='0'>
  477. ${sub.entityName?uncap_first}List: allValues.tablesValue[${subManyIndex}].values,
  478. <#assign subManyIndex = subManyIndex+1>
  479. <#else>
  480. ${sub.entityName?uncap_first}List: this.$refs.${sub.entityName?uncap_first}Form.getFormData(),
  481. </#if>
  482. </#list>
  483. }
  484. },
  485. <#if bpm_flag>
  486. //渲染流程表单数据
  487. showFlowData(){
  488. if(this.formBpm === true){
  489. let params = {id:this.formData.dataId};
  490. getAction(this.url.queryById,params).then((res)=>{
  491. if(res.success){
  492. this.edit (res.result);
  493. }
  494. })
  495. }
  496. },
  497. </#if>
  498. validateError(msg){
  499. this.$message.error(msg)
  500. },
  501. close() {
  502. this.visible = false
  503. this.$emit('close')
  504. this.$refs.form.clearValidate();
  505. },
  506. <#if form_popup>
  507. popupCallback(value,row){
  508. this.model = Object.assign(this.model, row);
  509. },
  510. </#if>
  511. <#if form_cat_tree>
  512. handleCategoryChange(value,backObj){
  513. this.model = Object.assign(this.model, backObj);
  514. }
  515. </#if>
  516. }
  517. }
  518. </script>
  519. <style scoped>
  520. </style>