shopingCatModal.vue 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <template>
  2. <a-drawer
  3. :zIndex="zIndex"
  4. placement="right"
  5. :visible="visible"
  6. :width="width"
  7. :get-container="false"
  8. :wrap-style="{ position: 'absolute' }"
  9. @close="onClose"
  10. wrapClassName="shopingCat-drawer jg-drawer-wrap">
  11. <div slot="title">
  12. <strong>{{ title }}</strong>
  13. <span style="color: #ed1c24;;margin-left:10px;font-size: 12px;" v-if="purchaseTargetType&&(purchaseTargetType=='DEALER_UP'||purchaseTargetType=='DEALER_SUPPLIER')">注意:仅可添加本供应商有权限的产品</span>
  14. <span style="color: #ed1c24;;margin-left:10px;font-size: 12px;" v-else-if="purchaseTargetType&&purchaseTargetType=='SUPPLIER_SYS'">注意:仅可添加本供应商有经销权且总部已上线的{{ orderType?orderType=='TIRE'?'轮胎':'非轮胎':'' }}产品</span>
  15. </div>
  16. <shopingCat ref="shopingCat" :purchaseType="purchaseTargetType" modes="modals" @ok="handleok"></shopingCat>
  17. </a-drawer>
  18. </template>
  19. <script>
  20. import { commonMixin } from '@/utils/mixin'
  21. import shopingCat from '@/views/shoppingCarManagement/shoppingCar/list.vue'
  22. export default {
  23. name: 'ShopingCatModal',
  24. mixins: [commonMixin],
  25. components: {
  26. shopingCat
  27. },
  28. props: {
  29. showModal: {
  30. type: Boolean,
  31. default: false
  32. },
  33. width: {
  34. type: [String, Number],
  35. default: '70%'
  36. },
  37. zIndex: {
  38. type: Number,
  39. default: 100
  40. },
  41. paramsData: {
  42. type: Object
  43. },
  44. purchaseTargetType: {// 提示语显示
  45. type: String,
  46. default: null
  47. },
  48. orderType: {// 是否是轮胎产品
  49. type: String,
  50. default: null
  51. }
  52. },
  53. watch: {
  54. showModal (newValue, oldValue) {
  55. this.visible = newValue
  56. if (newValue) {
  57. setTimeout(() => {
  58. this.$refs.shopingCat.pageInit(this.paramsData)
  59. }, 500)
  60. }
  61. }
  62. },
  63. data () {
  64. return {
  65. visible: this.showModal,
  66. title: '购物车'
  67. }
  68. },
  69. methods: {
  70. onClose () {
  71. this.$emit('close')
  72. },
  73. handleok () {
  74. this.$emit('ok')
  75. }
  76. }
  77. }
  78. </script>
  79. <style lang="less">
  80. .shopingCat-drawer {
  81. .ant-drawer-header{
  82. padding: 13px 20px;
  83. }
  84. .ant-drawer-body {
  85. padding: 0 5px;
  86. height: calc(100% - 50px);
  87. display: flex;
  88. flex-direction: column;
  89. overflow: auto;
  90. > div {
  91. height: 100%;
  92. }
  93. }
  94. }
  95. </style>