examine-dialog.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <template>
  2. <div>
  3. <el-dialog title="批量审批" :visible.sync="isShow" :show-close="false" width="400px" :close-on-click-modal="false">
  4. <el-form ref="examineForm" :model="examineForm" :rules="examineFormRules" label-position="left" label-width="80px">
  5. <el-form-item label="审批状态" prop="status">
  6. <el-radio-group v-model="examineForm.status">
  7. <el-radio :label="'OK'">通过</el-radio>
  8. <el-radio :label="'FAIL'">驳回</el-radio>
  9. </el-radio-group>
  10. </el-form-item>
  11. <el-form-item label="审批备注" prop="remark">
  12. <el-input
  13. type="textarea"
  14. :autosize="{ minRows: 2, maxRows: 4}"
  15. placeholder="请输入审批备注"
  16. v-model="examineForm.remark">
  17. </el-input>
  18. </el-form-item>
  19. </el-form>
  20. <div slot="footer" class="dialog-footer">
  21. <el-button @click="cancelForm">取 消</el-button>
  22. <el-button type="primary" @click="submitForm">确 定</el-button>
  23. </div>
  24. </el-dialog>
  25. </div>
  26. </template>
  27. <script>
  28. export default {
  29. name: 'EditDateDialog',
  30. props: {
  31. isShow: {
  32. type: Boolean,
  33. default: false
  34. },
  35. examineForm: {
  36. type: Object,
  37. default: {
  38. date: '',
  39. }
  40. }
  41. },
  42. data() {
  43. return {
  44. examineFormRules: {
  45. status: [
  46. { required: true, message: '请选择审批状态', trigger: 'change' }
  47. ],
  48. },
  49. }
  50. },
  51. methods: {
  52. cancelForm() {
  53. this.$emit('update:isShow', false);
  54. this.$refs.examineForm.resetFields()
  55. },
  56. submitForm() {
  57. this.$refs.examineForm.validate((valid) => {
  58. if (valid) {
  59. this.$parent.submitExamineForm();
  60. this.$refs.examineForm.resetFields()
  61. }
  62. })
  63. }
  64. }
  65. }
  66. </script>
  67. <style>
  68. </style>