d8df2add64952a89bf058978e7389635fcbbe372.svn-base 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. <template>
  2. <a-drawer
  3. :title="title"
  4. :width="800"
  5. placement="right"
  6. :closable="false"
  7. @close="close"
  8. :visible="visible">
  9. <a-spin :spinning="confirmLoading">
  10. <a-form-model ref="form" :model="model" :rules="validatorRules">
  11. <#list columns as po><#rt/>
  12. <#if po.fieldName !='id'><#rt/>
  13. <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" prop="${po.fieldName}" label="${po.filedComment}">
  14. <#if po.fieldType =='date'>
  15. <a-date-picker v-model="model.${po.fieldName}" />
  16. <#elseif po.fieldType =='datetime'>
  17. <a-date-picker showTime valueFormat='YYYY-MM-DD HH:mm:ss' v-model="model.${po.fieldName}" />
  18. <#elseif "int,decimal,double,"?contains(po.fieldType)>
  19. <a-input-number v-model="model.${po.fieldName}" />
  20. <#else>
  21. <a-input placeholder="请输入${po.filedComment}" v-model="model.${po.fieldName}" />
  22. </#if>
  23. </a-form-model-item>
  24. </#if>
  25. </#list>
  26. </a-form-model>
  27. </a-spin>
  28. <div class="drawer-bootom-button">
  29. <a-button type="primary" @click="handleOk">确定</a-button>
  30. <a-button type="primary" @click="handleCancel">取消</a-button>
  31. </div>
  32. </a-drawer>
  33. </template>
  34. <script>
  35. import { httpAction } from '@/api/manage'
  36. import moment from "moment"
  37. export default {
  38. name: "${entityName}Modal",
  39. data () {
  40. return {
  41. title:"操作",
  42. visible: false,
  43. model: {},
  44. labelCol: {
  45. xs: { span: 24 },
  46. sm: { span: 5 },
  47. },
  48. wrapperCol: {
  49. xs: { span: 24 },
  50. sm: { span: 16 },
  51. },
  52. confirmLoading: false,
  53. validatorRules:{
  54. <#list columns as po>
  55. <#if po.fieldName !='id'>
  56. <#if po.nullable =='N'>
  57. ${po.fieldName}:[{ required: true, message: '请输入${po.filedComment}!' }],
  58. </#if>
  59. </#if>
  60. </#list>
  61. },
  62. url: {
  63. add: "/${entityPackage}/${entityName?uncap_first}/add",
  64. edit: "/${entityPackage}/${entityName?uncap_first}/edit",
  65. },
  66. }
  67. },
  68. created () {
  69. },
  70. methods: {
  71. add () {
  72. //初始化默认值
  73. this.edit({});
  74. },
  75. edit (record) {
  76. this.model = Object.assign({}, record);
  77. this.visible = true;
  78. },
  79. close () {
  80. this.$emit('close');
  81. this.visible = false;
  82. this.$refs.form.clearValidate();
  83. },
  84. handleOk () {
  85. const that = this;
  86. // 触发表单验证
  87. this.$refs.form.validate(valid => {
  88. if (valid) {
  89. that.confirmLoading = true;
  90. let httpurl = '';
  91. let method = '';
  92. if(!this.model.id){
  93. httpurl+=this.url.add;
  94. method = 'post';
  95. }else{
  96. httpurl+=this.url.edit;
  97. method = 'post';
  98. }
  99. httpAction(httpurl,this.model,method).then((res)=>{
  100. if(res.success){
  101. that.$message.success(res.message);
  102. that.$emit('ok');
  103. }else{
  104. that.$message.warning(res.message);
  105. }
  106. }).finally(() => {
  107. that.confirmLoading = false;
  108. that.close();
  109. })
  110. }else{
  111. return false;
  112. }
  113. })
  114. },
  115. handleCancel () {
  116. this.close()
  117. },
  118. }
  119. }
  120. </script>
  121. <style lang="less" scoped>
  122. /**Button按钮间距*/
  123. .ant-btn {
  124. margin-left: 30px;
  125. margin-bottom: 30px;
  126. float: right;
  127. }
  128. /**抽屉按钮样式*/
  129. .drawer-bootom-button {
  130. position: absolute;
  131. bottom: -8px;
  132. width: 100%;
  133. border-top: 1px solid #e8e8e8;
  134. padding: 10px 16px;
  135. text-align: right;
  136. left: 0;
  137. background: #fff;
  138. border-radius: 0 0 2px 2px;
  139. }
  140. </style>