auditModal.vue 2.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. <template>
  2. <a-modal
  3. centered
  4. :footer="null"
  5. :maskClosable="false"
  6. class="audit-modal"
  7. :title="modalTit"
  8. v-model="isShow"
  9. @cancel="isShow=false"
  10. :width="550">
  11. <a-spin :spinning="spinning" tip="Loading...">
  12. <a-form-model
  13. id="audit-modal-form"
  14. ref="ruleForm"
  15. :model="detailData"
  16. :label-col="formItemLayout.labelCol"
  17. :wrapper-col="formItemLayout.wrapperCol"
  18. >
  19. <a-form-model-item label="客户名称">{{ detailData&&detailData.buyerName || '--' }}</a-form-model-item>
  20. <a-form-model-item label="发货经销商">
  21. {{ detailData&&detailData.transferDealerName||'--' }}
  22. </a-form-model-item>
  23. <div style="margin:20px auto;width:80%;">由于<strong style="color:#ed1c24;">{{ detailData&&detailData.transferDealerName }}</strong>非<strong style="color:#ed1c24;">{{ detailData&&detailData.buyerName }}</strong>的轮胎上级或省仓,需上级审核通过后完成转单。</div>
  24. </a-form-model>
  25. <div class="btn-cont">
  26. <a-button id="audit-modal-back" @click="handleSave('0')">审核不通过</a-button>
  27. <a-button type="primary" style="margin-left: 15px;" id="audit-modal-save" @click="handleSave('1')">审核通过</a-button>
  28. </div>
  29. </a-spin>
  30. </a-modal>
  31. </template>
  32. <script>
  33. export default {
  34. name: 'AuditConfirmModal',
  35. props: {
  36. openModal: { // 弹框显示状态
  37. type: Boolean,
  38. default: false
  39. },
  40. detailData: {
  41. type: Object,
  42. default: () => {
  43. return null
  44. }
  45. }
  46. },
  47. data () {
  48. return {
  49. isShow: this.openModal, // 是否打开弹框
  50. formItemLayout: {
  51. labelCol: { span: 6 },
  52. wrapperCol: { span: 16 }
  53. },
  54. spinning: false
  55. }
  56. },
  57. computed: {
  58. modalTit () {
  59. const title = (this.detailData && this.detailData.transferDate) ? '(' + this.detailData.transferDate + ')' : ''
  60. return '转单申请' + title
  61. }
  62. },
  63. methods: {
  64. // 确认审核
  65. handleSave (val) {
  66. this.$emit('ok', val)
  67. }
  68. },
  69. watch: {
  70. // 父页面传过来的弹框状态
  71. openModal (newValue, oldValue) {
  72. this.isShow = newValue
  73. },
  74. // 重定义的弹框状态
  75. isShow (newValue, oldValue) {
  76. if (!newValue) {
  77. this.$emit('close')
  78. }
  79. }
  80. }
  81. }
  82. </script>
  83. <style lang="less">
  84. .audit-modal{
  85. .ant-form-item{
  86. margin-bottom: 10px;
  87. }
  88. .btn-cont {
  89. text-align: center;
  90. margin: 40px 0 10px;
  91. }
  92. }
  93. </style>