uskyq/assets/js/component/dialogCom.js

export default {
  props: {
    fatherdialogv: Boolean,
    ruleform:Object,
    fatherrules:Object,
    fatherdialoga:Object,
  },
  template: `
  <el-dialog title="项目咨询" style="display:none" :style="{display:(fatherdialogv?'block':'none')}" @close="closeDialog('ruleform')"
                :visible.sync="fatherdialogv" width="700px" center class="feedBackDialog" :lock-scroll="false">
                <el-form :model="ruleform" :rules="fatherrules" ref="ruleform" label-width="80px" class="demo-ruleform">
                    <el-form-item label="" prop="platName" style="">
                        <el-radio-group v-model="ruleform.platName">
                            <el-radio-button :label="item.categoryName" v-for="item in fatherdialoga" :key="item.id">
                            </el-radio-button>
                        </el-radio-group>
                    </el-form-item>
                    <el-row :gutter="20">
                        <el-col :span="12">
                            <el-form-item label="姓名" prop="consultName">
                                <el-input v-model="ruleform.consultName"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="联系电话" prop="consultPhone">
                                <el-input v-model="ruleform.consultPhone"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="邮箱" prop="mail">
                                <el-input v-model="ruleform.mail"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="公司" prop="company">
                                <el-input v-model="ruleform.company"></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item label="需求描述" prop="consultContent">
                        <el-input type="textarea" v-model="ruleform.consultContent"></el-input>
                    </el-form-item>
                </el-form>

                <!-- <span>需要注意的是内容是默认不居中的</span> -->
                <span slot="footer" class="dialog-footer">
                    <el-button @click="resetForm('ruleform')">取 消</el-button>
                    <el-button type="primary" @click="submitForm('ruleform')">提 交</el-button>
                </span>
            </el-dialog>
  `,
  mounted: function () {

  },
  methods:{

    

     //公共弹框
     submitForm(formName) {
      var _this = this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          console.log(_this.ruleform)
          let param = JSON.stringify(_this.ruleform)
          jQuery.ajax({
            type: 'POST',
            // dataType: 'json',
            contentType: 'application/json;charset=UTF-8',
            url: window.FQDN2 + 'siteReview',
            data: param
          }).done(function (res) {
            if (res.status === "SUCCESS") {
              _this.$message({
                message: '提交成功',
                type: 'success'
              });
              _this.fatherdialogv = false;
              _this.$refs[formName].resetFields(); //重置from校验
            }
          }).fail(function (err) {});
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },

    /** 关闭弹窗 */
    closeDialog(formName) {
      this.$emit('data-event', false); 
      this.$refs[formName].resetFields();
    },

    // 重置表单
    resetForm(formName) {
      this.$refs[formName].resetFields();
      this.fatherdialogv = false
    },
  }
}