otherPartItem.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. <template>
  2. <block>
  3. <view class="nav-right-item flex" v-for="item in list" :key="item.productSn">
  4. <view class="uni-col-2">
  5. <u-image :src="item.images+'?x-oss-process=image/resize,m_fixed,h_60,w_60,color_ffffff'"
  6. @click="viewImg(item)" border-radius="30" width="100" height="100" bg-color="#EBEBEB"></u-image>
  7. </view>
  8. <view class="item-info uni-col-10">
  9. <view class="item-name">
  10. <text>{{item.name}}</text>
  11. </view>
  12. <view class="item-detail">
  13. <view class="item-detail-info">
  14. <view class="flex justify_between">
  15. <text class="item-detail-text flex_1">{{item.code}}</text>
  16. <text class="item-detail-text" style="width: 50%;text-align: right;">库存:{{item.currentInven?item.currentInven:0}}{{item.unit}}</text>
  17. </view>
  18. <view class="flex" v-if="item.productTypeSn=='543766811373752320'">
  19. <uni-tag :text="item.origCode" inverted circle type="success"></uni-tag>
  20. </view>
  21. <view class="flex justify_between">
  22. <view class="item-detail-text flex align_center"
  23. @click="openPriceModal(item,0,showShelfDetial)">
  24. <view class="item-price" :style="{color:!item.price?'#666':''}"
  25. v-if="showCarPrice&&configPrice&&configPrice.shelf_price_show == '1'">
  26. {{item.price?'¥'+item.price:'暂无价格'}}
  27. </view>
  28. <view class="item-price" :style="{color:!item.cost?'#666':''}"
  29. v-if="showCostPrice&&configPrice&&configPrice.shelf_cost_show == '1'">
  30. {{item.cost?'¥'+item.cost:'暂无价格'}}
  31. </view>
  32. <uni-icons type="arrowright" color="#00aaff" size="12"
  33. v-if="priceShowVal&&showShelfDetial"></uni-icons>
  34. </view>
  35. <view class="item-detail-text flex align_center" v-if="item.currentInven">
  36. <button @click="addPart(item)" v-if="!item.checked"
  37. :style="{width:'48rpx',height:'48rpx',background:'#066cff',borderRadius:'50px',padding:0,border:'none'}"
  38. type="primary" size="mini">
  39. <uni-icons type="plusempty" color="#fff" size="20"></uni-icons>
  40. </button>
  41. <uni-number-box v-else @change="e=>updateNums(e,item.productSn)" v-model="item.qty"
  42. :min="0" :max="item.currentInven"></uni-number-box>
  43. </view>
  44. <view class="item-detail-text flex align_center" v-else>
  45. <text @click="addPart(item)" v-if="!item.checked" class="phtxt">我要急送</text>
  46. <uni-number-box v-else @change="e=>updateNums(e,item.productSn)" v-model="item.qty"
  47. :min="0"></uni-number-box>
  48. </view>
  49. </view>
  50. </view>
  51. </view>
  52. </view>
  53. </view>
  54. </block>
  55. </template>
  56. <script>
  57. export default {
  58. props: {
  59. list: {
  60. type: Array,
  61. default: () => {
  62. return []
  63. }
  64. },
  65. configPrice: {
  66. type: Object,
  67. default: () => {
  68. return {}
  69. }
  70. },
  71. showCarPrice: {
  72. type: Boolean,
  73. default: false
  74. },
  75. showCostPrice: {
  76. type: Boolean,
  77. default: false
  78. },
  79. showShelfDetial: {
  80. type: Boolean,
  81. default: false
  82. },
  83. showNonShelfDetial: {
  84. type: Boolean,
  85. default: false
  86. },
  87. priceShowVal: {
  88. type: Boolean,
  89. default: false
  90. },
  91. },
  92. data() {
  93. return {}
  94. },
  95. methods: {
  96. openPriceModal(item, type, show) {
  97. this.$emit('openPrice', item, type, show)
  98. },
  99. addPart(item) {
  100. this.$emit('addPart', item, 'other')
  101. },
  102. updateNums(value, id) {
  103. this.$emit('updateNums', {
  104. value: value,
  105. index: id
  106. })
  107. },
  108. viewImg(item) {
  109. this.$emit('viewImg', item)
  110. }
  111. }
  112. }
  113. </script>
  114. <style lang="less">
  115. @import '/flex.css';
  116. .nav-right-item {
  117. padding: 15upx 25upx;
  118. border-bottom: 2rpx solid #f5f5f5;
  119. .uni-col-2 {
  120. width: 50px;
  121. }
  122. .item-info {
  123. padding-left: 10upx;
  124. width: 80%;
  125. flex-grow: 1;
  126. .item-name {
  127. font-size: 30upx;
  128. color: #191919;
  129. display: flex;
  130. align-items: center;
  131. >image {
  132. width: 38rpx;
  133. height: 38rpx;
  134. margin-right: 10rpx;
  135. }
  136. >text {
  137. flex: 1;
  138. word-break: break-all;
  139. }
  140. }
  141. .item-detail {
  142. .item-detail-info {
  143. padding: 10upx 0 4upx;
  144. /deep/ .uni-tag {
  145. word-break: break-all;
  146. font-size: 28rpx;
  147. color: #0fab04eee;
  148. border: 0;
  149. padding: 0.2rem 0.3rem;
  150. }
  151. >view {
  152. padding-bottom: 10rpx;
  153. align-items: center;
  154. .item-detail-text {
  155. color: #999;
  156. .phtxt {
  157. color: #0485F6;
  158. font-size: 28upx;
  159. }
  160. .item-price {
  161. color: #FB1E1E;
  162. font-size: 28upx;
  163. }
  164. }
  165. }
  166. }
  167. }
  168. }
  169. }
  170. </style>