freezeQtyModal.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. <template>
  2. <u-mask class="productModal" :show="isShow" :mask-click-able="false">
  3. <view class="product-con">
  4. <view class="product-main">
  5. <view v-for="item in list" :key="item.id">22</view>
  6. </view>
  7. <view class="product-footer">
  8. <view class="button-cancel" @click="isShow=false">取消</view>
  9. <view class="button-confirm" @click="handleConfirm">确定</view>
  10. </view>
  11. </view>
  12. </u-mask>
  13. </template>
  14. <script>
  15. import { queryWaitListByShelfSn } from '@/api/stockCheck'
  16. export default {
  17. props: {
  18. openModal: { // 弹框显示状态
  19. type: Boolean,
  20. default: false
  21. },
  22. infoData: {
  23. tyoe: Object,
  24. default: ()=>{
  25. return null
  26. }
  27. },
  28. },
  29. data() {
  30. return {
  31. isShow: this.openModal, // 是否打开弹框
  32. list: []
  33. }
  34. },
  35. methods: {
  36. // 确认
  37. handleConfirm(){
  38. },
  39. // 获取列表数据
  40. getList(){
  41. queryWaitListByShelfSn({shelfSn: this.infoData.shelfSn}).then(res => {
  42. if(res.status == 200){
  43. this.list = res.data||[]
  44. }
  45. })
  46. }
  47. },
  48. watch: {
  49. // 父页面传过来的弹框状态
  50. openModal (newValue, oldValue) {
  51. this.isShow = newValue
  52. },
  53. // 重定义的弹框状态
  54. isShow (newValue, oldValue) {
  55. if (!newValue) {
  56. this.$emit('close')
  57. }else{
  58. this.getList()
  59. }
  60. }
  61. }
  62. }
  63. </script>
  64. <style lang="scss" scoped>
  65. .productModal{
  66. width: 100%;
  67. height: 100%;
  68. .text-c{
  69. text-align: center;
  70. }
  71. .product-con{
  72. width: 78%;
  73. margin: 55% auto 0;
  74. background-color: #fff;
  75. border-radius: 24upx;
  76. .product-main{
  77. padding: 60upx 20upx 50upx;
  78. }
  79. .product-footer{
  80. font-size: 30upx;
  81. display: flex;
  82. justify-content: space-between;
  83. align-items: center;
  84. text-align: center;
  85. border-top: 1upx solid #E5E5E5;
  86. .button-cancel{
  87. color: #999;
  88. border-right: 1upx solid #E5E5E5;
  89. flex-grow: 1;
  90. padding: 20upx 0;
  91. }
  92. .button-confirm{
  93. color: #2A86F4;
  94. flex-grow: 1;
  95. padding: 20upx 0;
  96. }
  97. }
  98. }
  99. }
  100. </style>