123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156 |
- <template>
- <j-modal
- :title="title"
- :width="800"
- :visible="visible"
- :confirmLoading="confirmLoading"
- switchFullscreen
- @ok="handleOk"
- @cancel="handleCancel"
- cancelText="关闭">
- <a-spin :spinning="confirmLoading">
- <a-form :form="form">
- <#list columns as po><#rt/>
- <#if po.fieldName !='id'><#rt/>
- <a-form-item
- :labelCol="labelCol"
- :wrapperCol="wrapperCol"
- label="${po.filedComment}">
- <#if po.fieldType =='date'>
- <a-date-picker v-decorator="[ '${po.fieldName}', <#if po.nullable =='N'>validatorRules.${po.fieldName} <#else>{}</#if>]" />
- <#elseif po.fieldType =='datetime'>
- <a-date-picker showTime format='YYYY-MM-DD HH:mm:ss' v-decorator="[ '${po.fieldName}', <#if po.nullable =='N'>validatorRules.${po.fieldName} <#else>{}</#if>]" />
- <#elseif "int,decimal,double,"?contains(po.fieldType)>
- <a-input-number v-decorator="[ '${po.fieldName}', <#if po.nullable =='N'>validatorRules.${po.fieldName} <#else>{}</#if>]" />
- <#else>
- <a-input placeholder="请输入${po.filedComment}" v-decorator="['${po.fieldName}', <#if po.nullable =='N'>validatorRules.${po.fieldName} <#else>{}</#if>]" />
- </#if>
- </a-form-item>
- </#if>
- </#list>
- </a-form>
- </a-spin>
- </j-modal>
- </template>
- <script>
- import { httpAction } from '@/api/manage'
- import pick from 'lodash.pick'
- import moment from "moment"
- export default {
- name: "${entityName}Modal",
- data () {
- return {
- title:"操作",
- visible: false,
- model: {},
- labelCol: {
- xs: { span: 24 },
- sm: { span: 5 },
- },
- wrapperCol: {
- xs: { span: 24 },
- sm: { span: 16 },
- },
- confirmLoading: false,
- form: this.$form.createForm(this),
- validatorRules:{
- <#list columns as po>
- <#if po.fieldName !='id'>
- <#if po.nullable =='N'>
- ${po.fieldName}:{rules: [{ required: true, message: '请输入${po.filedComment}!' }]},
- </#if>
- </#if>
- </#list>
- },
- url: {
- add: "/${entityPackage}/${entityName?uncap_first}/add",
- edit: "/${entityPackage}/${entityName?uncap_first}/edit",
- },
- }
- },
- created () {
- },
- methods: {
- add () {
- this.edit({});
- },
- edit (record) {
- this.form.resetFields();
- this.model = Object.assign({}, record);
- this.visible = true;
- this.$nextTick(() => {
- this.form.setFieldsValue(pick(this.model<#list columns as po><#if po.fieldName !='id' && po.fieldType?index_of("date")==-1>,'${po.fieldName}'</#if></#list>))
- //时间格式化
- <#list columns as po>
- <#if po.fieldName !='id' && po.fieldType?index_of("date")!=-1>
- this.form.setFieldsValue({${po.fieldName}:this.model.${po.fieldName}?moment(this.model.${po.fieldName}):null})
- </#if>
- </#list>
- });
- },
- close () {
- this.$emit('close');
- this.visible = false;
- },
- handleOk () {
- const that = this;
- // 触发表单验证
- this.form.validateFields((err, values) => {
- if (!err) {
- that.confirmLoading = true;
- let httpurl = '';
- let method = '';
- if(!this.model.id){
- httpurl+=this.url.add;
- method = 'post';
- }else{
- httpurl+=this.url.edit;
- method = 'post';
- }
- let formData = Object.assign(this.model, values);
- //时间格式化
- <#list columns as po>
- <#if po.fieldName !='id' && po.fieldType =='date'>
- formData.${po.fieldName} = formData.${po.fieldName}?formData.${po.fieldName}.format():null;
- <#elseif po.fieldName !='id' && po.fieldType =='datetime'>
- formData.${po.fieldName} = formData.${po.fieldName}?formData.${po.fieldName}.format('YYYY-MM-DD HH:mm:ss'):null;
- </#if>
- </#list>
- console.log(formData)
- httpAction(httpurl,formData,method).then((res)=>{
- if(res.success){
- that.$message.success(res.message);
- that.$emit('ok');
- }else{
- that.$message.warning(res.message);
- }
- }).finally(() => {
- that.confirmLoading = false;
- that.close();
- })
- }
- })
- },
- handleCancel () {
- this.close()
- },
- }
- }
- </script>
- <style lang="less" scoped>
- </style>
|