productUniversal.vue 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. <template>
  2. <view class="productPricing-content">
  3. <scroll-view class="product-list" scroll-y @scrolltolower="onreachBottom">
  4. <view class="st-detailList-main">
  5. <view class="st-detailList-main-item" v-for="(item, index) in listData" :key="item.id">
  6. <view class="st-detailList-tit">
  7. <!-- @click="item.titFlag=!item.titFlag" -->
  8. <text style="font-weight: bold;">{{item.product.name}}</text>
  9. <view class="p-tit-box" v-show="item.titFlag">{{item.product.name}}</view>
  10. <u-tag size="mini" style="margin:10rpx 0 0 20rpx;" :type="item.product.onlineFalg==1?'success':'info'" :text="item.product.onlineFalgDictValue"></u-tag>
  11. <copyText :text="item.product.name" label="产品名称"></copyText>
  12. </view>
  13. <view class="st-detailList-item-con flex align_center">
  14. <view class="flex_1">
  15. <view class="padding_3">产品编码:{{item.productCode}} <copyText :text="item.productCode" label="产品编码"></copyText></view>
  16. <view class="padding_3">通用产品编码:{{item.productCommonCode}} </view>
  17. <!-- @click="item.c_titFlag=!item.c_titFlag" -->
  18. <view class="padding_3" >
  19. <text>通用产品名称:{{item.productCommon.name || '--'}}</text>
  20. <u-tag style="margin:10rpx 0 0 20rpx;" size="mini" :type="item.productCommon.onlineFalg==1?'success':'info'" :text="item.productCommon.onlineFalgDictValue"></u-tag>
  21. </view>
  22. <view class="p-t-tit-box" v-show="item.c_titFlag">{{item.productCommon.name || '--'}}</view>
  23. <view class="padding_3">通用产品分类:
  24. <text v-if="item.productCommon.productTypeName2 || item.productCommon.productTypeName3">{{ item.productCommon.productTypeName2 }} {{ item.productCommon.productTypeName3 ? '>' : '' }} {{ item.productCommon.productTypeName3 }}</text>
  25. <text v-else>--</text>
  26. </view>
  27. <view class="font_13">
  28. 创建时间:<text class="gray">{{item.createDate}}</text>
  29. </view>
  30. </view>
  31. </view>
  32. </view>
  33. <u-empty v-if="listData.length == 0 &&status!='loading'" :text="noDataText" mode="list" ></u-empty>
  34. <view style="padding-bottom: 20upx;">
  35. <u-loadmore v-if="totalNum>listData.length || status=='loading'" :status="status" />
  36. </view>
  37. </view>
  38. </scroll-view>
  39. <!-- 搜索弹窗 -->
  40. <searchParts :showModal="showModal" @refresh="refreshList" @close="showModal=false"/>
  41. </view>
  42. </template>
  43. <script>
  44. import { productUniversalQueryPage } from '@/api/sales'
  45. import copyText from '@/pages/common/copyText.vue'
  46. import searchParts from './searchParts.vue'
  47. export default{
  48. components:{searchParts,copyText},
  49. data(){
  50. return{
  51. listData:[],
  52. totalNum:0,
  53. pageNo:1,
  54. pageSize:15,
  55. noDataText: '暂无数据',
  56. status: 'loadmore',
  57. showModal:false,
  58. params:{
  59. productCode:'',
  60. productName:'',
  61. productCommonCode:'',
  62. productCommonName:'',
  63. onlineFalg:undefined
  64. }
  65. }
  66. },
  67. onNavigationBarButtonTap(e){
  68. this.showModal=true
  69. },
  70. onBackPress() {
  71. if(this.showModal){
  72. this.showModal = false
  73. return true
  74. }
  75. },
  76. onLoad(option) {
  77. this.getList()
  78. },
  79. methods:{
  80. // 刷新列表
  81. refreshList(val){
  82. this.params =val ? val : {},
  83. this.listData = []
  84. this.totalNum = 0
  85. this.getList(1)
  86. },
  87. // 列表
  88. getList(pageNo){
  89. const _this = this
  90. if (pageNo) {
  91. this.pageNo = pageNo
  92. }
  93. let params = Object.assign(this.params, { pageNo: this.pageNo, pageSize: this.pageSize })
  94. this.status = "loading"
  95. productUniversalQueryPage(params).then(res => {
  96. if (res.status == 200) {
  97. if(res.data.list.length>0){
  98. res.data.list.forEach(con=>{
  99. con.titFlag = false
  100. con.c_titFlag = false
  101. })
  102. }
  103. if(this.pageNo>1){
  104. this.listData = this.listData.concat(res.data.list || [])
  105. }else{
  106. this.listData = res.data.list || []
  107. }
  108. this.totalNum = res.data.count || 0
  109. } else {
  110. this.listData = []
  111. this.totalNum = 0
  112. this.noDataText = res.message
  113. }
  114. this.status = "loadmore"
  115. })
  116. },
  117. // scroll-view到底部加载更多
  118. onreachBottom() {
  119. if(this.listData.length < this.totalNum){
  120. this.pageNo += 1
  121. this.getList()
  122. }
  123. }
  124. }
  125. }
  126. </script>
  127. <style lang="scss">
  128. .productPricing-content{
  129. width:100%;
  130. height: 100vh;
  131. .product-list{
  132. height: 100vh;
  133. .st-detailList-main{
  134. padding: 20upx;
  135. .st-detailList-main-item{
  136. background: #ffffff;
  137. padding: 20upx;
  138. margin-bottom: 25upx;
  139. border-radius: 25upx;
  140. box-shadow: 1px 1px 3px #EEEEEE;
  141. .st-detailList-tit{
  142. padding-bottom: 20upx;
  143. position: relative;
  144. border-bottom: 1px solid #e4e7ed;
  145. .p-tit-box{
  146. width: 100%;
  147. padding:20rpx 30rpx;
  148. box-sizing: border-box;
  149. position: absolute;
  150. top: 60rpx;
  151. left:0;
  152. color:#fff;
  153. background:rgba(0,0,0,.8);
  154. }
  155. }
  156. .st-detailList-item-con{
  157. padding: 20upx;
  158. font-size: 26upx;
  159. position: relative;
  160. .p-t-tit-box{
  161. width: 100%;
  162. padding:20rpx 30rpx;
  163. box-sizing: border-box;
  164. position: absolute;
  165. bottom: 66rpx;
  166. left:0;
  167. color:#fff;
  168. background:rgba(0,0,0,.8);
  169. }
  170. .gray{
  171. color: gray;
  172. }
  173. .pimgs{
  174. margin-right: 16upx;
  175. }
  176. .font_13{
  177. font-size: 26upx;
  178. }
  179. .padding_3{
  180. padding: 6upx 0;
  181. word-break: break-all;
  182. }
  183. }
  184. .price-all{
  185. border-top: 1px solid #e4e7ed;
  186. padding: 20upx 20upx 0;
  187. .price-item1{
  188. width: 18%;
  189. border-right: 1px solid #e4e7ed;
  190. text-align: center;
  191. >view{
  192. color:#999;
  193. }
  194. }
  195. .price-item2{
  196. width: 46%;
  197. border-right: none;
  198. text-align: center;
  199. >view{
  200. color:#999;
  201. }
  202. }
  203. }
  204. }
  205. }
  206. }
  207. }
  208. </style>