DrugAllergensForm.vue 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <el-row>
  3. <el-col :span="24">
  4. <el-form
  5. :model="drugAllergensForm"
  6. ref="drugAllergensForm"
  7. class="sub-form"
  8. :validate-on-rule-change="false"
  9. :rules="rules"
  10. >
  11. <el-form-item label="药品类型" label-width="110px" prop="medtype">
  12. <el-select
  13. v-model="drugAllergensForm.medtype"
  14. placeholder="请选择药品类型"
  15. clearable
  16. @change="handleValue('medtype')"
  17. style="width: 100%"
  18. ref="dragType"
  19. >
  20. <el-option label="药品" value="药品"></el-option>
  21. <el-option label="药品类别" value="药品类别"></el-option>
  22. </el-select>
  23. </el-form-item>
  24. <el-form-item label="结果" label-width="110px" prop="result">
  25. <el-input
  26. v-model.trim="drugAllergensForm.result"
  27. placeholder="请输入结果"
  28. @blur="handleValue('result')"
  29. ></el-input>
  30. </el-form-item>
  31. <el-form-item label="名称" label-width="110px" prop="alias">
  32. <el-input
  33. v-model.trim="drugAllergensForm.alias"
  34. placeholder="请输入名称"
  35. @blur="handleValue('alias')"
  36. ></el-input>
  37. </el-form-item>
  38. </el-form>
  39. </el-col>
  40. </el-row>
  41. </template>
  42. <script>
  43. export default {
  44. name: 'DrugAllergensForm',
  45. props: ['data'],
  46. data() {
  47. let checkFrequency = (rule, value, callback) => {
  48. let dragType = this.$refs.dragType.value;
  49. if (dragType === '' || dragType === null) {
  50. callback('请选择药品类型');
  51. } else {
  52. callback();
  53. }
  54. };
  55. return {
  56. drugAllergensForm: {
  57. medtype: '',
  58. result: '',
  59. alias: ''
  60. },
  61. rules: {
  62. medtype: [
  63. {
  64. required: true,
  65. validator: checkFrequency,
  66. trigger: ['blur', 'change']
  67. }
  68. ]
  69. }
  70. };
  71. },
  72. computed: {},
  73. created() {
  74. this._initData();
  75. },
  76. mounted() {},
  77. methods: {
  78. _initData() {
  79. this.drugAllergensForm.medtype = this.data.medtype;
  80. this.drugAllergensForm.result = this.data.result;
  81. this.drugAllergensForm.alias = this.data.alias;
  82. },
  83. // 传值
  84. handleValue(from) {
  85. this.$emit('handleInput', {
  86. type: from,
  87. value: this.drugAllergensForm[from]
  88. });
  89. }
  90. }
  91. };
  92. </script>
  93. <style lang="less" scoped>
  94. </style>