WhisperingsForm.vue 4.67 KB
<template>
  <a-comment>
    <span key='comment-nested-reply-to' slot='actions'>Reply to</span>
    <a slot='author'>Han Solo</a>
    <a-avatar
      slot='avatar'
      alt='Han Solo'
      src='https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
    />
    <p slot='content'>
      We supply a series of design principles, practical patterns and high quality design resources
      (Sketch and Axure).
    </p>
    <a-comment>
      <span slot='actions'>Reply to</span>
      <a slot='author'>Han Solo</a>
      <a-avatar
        slot='avatar'
        alt='Han Solo'
        src='https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
      />
      <p slot='content'>
        We supply a series of design principles, practical patterns and high quality design
        resources (Sketch and Axure).
      </p>
      <a-comment>
        <span slot='actions'>Reply to</span>
        <a slot='author'>Han Solo</a>
        <a-avatar
          slot='avatar'
          alt='Han Solo'
          src='https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
        />
        <p slot='content'>
          We supply a series of design principles, practical patterns and high quality design
          resources (Sketch and Axure).
        </p>
      </a-comment>
      <a-comment>
        <span slot='actions'>Reply to</span>
        <a slot='author'>Han Solo</a>
        <a-avatar
          slot='avatar'
          alt='Han Solo'
          src='https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
        />
        <p slot='content'>
          We supply a series of design principles, practical patterns and high quality design
          resources (Sketch and Axure).
        </p>
      </a-comment>
    </a-comment>
  </a-comment>
</template>

<script>

import { VALIDATE_NO_PASSED } from '@/utils/JEditableTableUtil'
import { JEditableTableModelMixin } from '@/mixins/JEditableTableModelMixin'
import WhisperingsReplyForm from './WhisperingsReplyForm.vue'

export default {
  name: 'WhisperingsForm',
  mixins: [JEditableTableModelMixin],
  components: {
    WhisperingsReplyForm
  },
  data() {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
      labelCol2: {
        xs: { span: 24 },
        sm: { span: 3 }
      },
      wrapperCol2: {
        xs: { span: 24 },
        sm: { span: 20 }
      },
      model: {},
      // 新增时子表默认添加几行空数据
      addDefaultRowNum: 1,
      validatorRules: {},
      refKeys: ['whisperingsReply'],
      tableKeys: [],
      activeKey: 'whisperingsReply',
      // 悄悄话回复
      whisperingsReplyTable: {
        loading: false,
        dataSource: [],
        columns: []
      },
      url: {
        add: '/inspect/whisperings/add',
        edit: '/inspect/whisperings/edit',
        queryById: '/inspect/whisperings/queryById',
        whisperingsReply: {
          list: '/inspect/whisperings/queryWhisperingsReplyByMainId'
        }
      }
    }
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    }
  },
  created() {
  },
  methods: {
    addBefore() {
      this.$refs.whisperingsReplyForm.clearFormData()
    },
    getAllTable() {
      return new Promise(resolve => {
        resolve([])
      })
    },
    /** 调用完edit()方法之后会自动调用此方法 */
    editAfter() {
      this.$nextTick(() => {
        this.$refs.whisperingsReplyForm.initFormData(this.url.whisperingsReply.list, this.model.id)
      })
      // 加载子表数据
      if (this.model.id) {
        let params = { id: this.model.id }
      }
    },
    //校验所有一对一子表表单
    validateSubForm(allValues) {
      return new Promise((resolve, reject) => {
        Promise.all([
          this.$refs.whisperingsReplyForm.validate(0)
        ]).then(() => {
          resolve(allValues)
        }).catch(e => {
          if (e.error === VALIDATE_NO_PASSED) {
            // 如果有未通过表单验证的子表,就自动跳转到它所在的tab
            this.activeKey = e.index == null ? this.activeKey : this.refKeys[e.index]
          } else {
            console.error(e)
          }
        })
      })
    },
    /** 整理成formData */
    classifyIntoFormData(allValues) {
      let main = Object.assign(this.model, allValues.formValue)
      return {
        ...main, // 展开
        whisperingsReplyList: this.$refs.whisperingsReplyForm.getFormData()
      }
    },
    validateError(msg) {
      this.$message.error(msg)
    }

  }
}
</script>

<style scoped>
</style>