index.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. <template>
  2. <view class="mainBox">
  3. <uni-nav-bar background-color="#157A2C" color="#fff" fixed="true" statusBar="true" left-icon="back" title="商机"
  4. @clickLeft="back">
  5. </uni-nav-bar>
  6. <view class="top-wrapper">
  7. <uni-section>
  8. <uni-easyinput prefixIcon="search" style="width: 460rpx" v-model="searchVal" placeholder="名称">
  9. </uni-easyinput>
  10. </uni-section>
  11. <button class="search_btn" @click="doSearch">搜索</button>
  12. <image class="menu_icon" src="~@/static/pda/menu.svg"></image>
  13. </view>
  14. <view v-for="(item, index) in tableList" :key="index" style="position: relative;">
  15. <myCard @del="del(item)" :item="item" :index="index+1" :columns="columns" :btnList="btnList"></myCard>
  16. </view>
  17. <view style='margin-top: 20vh;' v-if="tableList.length==0">
  18. <u-empty iconSize='150' textSize='32' text='暂无数据'>
  19. </u-empty>
  20. </view>
  21. <view class="add" @click="add">
  22. <u-icon name="plus" color="#fff"></u-icon>
  23. </view>
  24. <u-toast ref="uToast"></u-toast>
  25. </view>
  26. </template>
  27. <script>
  28. import {
  29. getTableList,
  30. deleteInformation
  31. } from '@/api/saleManage/businessOpportunity/index.js'
  32. import myCard from '../components/myCard.vue'
  33. export default {
  34. components: {
  35. myCard,
  36. },
  37. data() {
  38. return {
  39. tableList: [],
  40. searchVal: '',
  41. page: 1,
  42. size: 10,
  43. isEnd: false,
  44. current: {},
  45. btnList: [{
  46. name: '详情',
  47. apiName: '',
  48. btnType: 'primary',
  49. type: '1',
  50. pageUrl: '/pages/saleManage/businessOpportunity/components/drawer',
  51. }, {
  52. name: '修改',
  53. apiName: '',
  54. btnType: 'primary',
  55. type: '1',
  56. pageUrl: '/pages/saleManage/businessOpportunity/add',
  57. judge: [{
  58. // authorities: 'eom:businessopportunity:update',
  59. },{
  60. key: 'approvalStatus',
  61. value: [0, 3],
  62. }],
  63. }, {
  64. name: '跟进记录',
  65. apiName: '',
  66. btnType: 'primary',
  67. type: '1',
  68. pageUrl: '/pages/saleManage/businessOpportunity/components/drawer',
  69. query: '&current=4',
  70. judge: [{
  71. key: 'approvalStatus',
  72. value: [0, 3]
  73. }],
  74. }, {
  75. name: '删除',
  76. apiName: 'del',
  77. btnType: 'error ',
  78. type: '2',
  79. pageUrl: '',
  80. judge: [{
  81. // authorities: 'eom:businessopportunity:delete',
  82. },{
  83. key: 'approvalStatus',
  84. value: [0, 3]
  85. }],
  86. }],
  87. columns: [
  88. [{
  89. label: '名称:',
  90. prop: 'name',
  91. type: 'title',
  92. className: 'perce100',
  93. }],
  94. [{
  95. label: '编码:',
  96. prop: 'code'
  97. }, {
  98. label: '客户名称:',
  99. prop: 'contactName'
  100. }],
  101. [{
  102. label: '产品名称:',
  103. prop: 'productNames'
  104. }, {
  105. label: '商机来源:',
  106. prop: 'sourceName'
  107. }],
  108. [{
  109. label: '商机阶段:',
  110. prop: 'stageName'
  111. }, {
  112. label: '赢单率:',
  113. prop: 'winRate',
  114. formatter: (row) => {
  115. return row.winRate ? row.winRate + '%' : '';
  116. }
  117. }],
  118. [{
  119. label: '负责人:',
  120. prop: 'responsibleName'
  121. }, {
  122. label: '创建人:',
  123. prop: 'createUserName'
  124. }],
  125. [{
  126. label: '操作:',
  127. prop: 'action',
  128. type: 'action',
  129. className: 'perce100',
  130. }],
  131. ]
  132. }
  133. },
  134. computed: {
  135. },
  136. onShow() {
  137. this.isEnd = false
  138. this.page = 1
  139. this.getList()
  140. },
  141. methods: {
  142. doSearch() {
  143. this.isEnd = false
  144. this.page = 1
  145. this.getList()
  146. },
  147. //获取列表信息
  148. getList() {
  149. if (this.isEnd) {
  150. return
  151. }
  152. uni.showLoading({
  153. title: '加载中'
  154. })
  155. let data = {
  156. pageNum: this.page,
  157. size: this.size,
  158. type: 1,
  159. name: this.searchVal
  160. }
  161. getTableList(data).then(res => {
  162. if (this.page === 1) {
  163. this.tableList = res.list
  164. } else {
  165. this.tableList.push(...res.list)
  166. }
  167. this.page += 1
  168. this.isEnd = this.tableList.length >= res.count
  169. }).then(() => {
  170. uni.hideLoading()
  171. })
  172. },
  173. add() {
  174. uni.navigateTo({
  175. url: '/pages/saleManage/businessOpportunity/add'
  176. })
  177. },
  178. view() {
  179. },
  180. del(item) {
  181. deleteInformation([item.id]).then(res => {
  182. this.isEnd = false
  183. this.page = 1
  184. this.$refs.uToast.show({
  185. type: "success",
  186. message: "操作成功",
  187. })
  188. this.getList(this.where)
  189. })
  190. }
  191. }
  192. }
  193. </script>
  194. <style lang="scss" scoped>
  195. .add {
  196. width: 96rpx;
  197. height: 96rpx;
  198. border-radius: 48rpx;
  199. background: #3c9cff;
  200. position: fixed;
  201. bottom: 100rpx;
  202. right: 24rpx;
  203. display: flex;
  204. align-items: center;
  205. justify-content: center;
  206. }
  207. .top-wrapper {
  208. background-color: #fff;
  209. display: flex;
  210. width: 750rpx;
  211. height: 88rpx;
  212. padding: 16rpx 32rpx;
  213. align-items: center;
  214. gap: 16rpx;
  215. /deep/.uni-section {
  216. margin-top: 0px;
  217. }
  218. /deep/.uni-section-header {
  219. padding: 0px;
  220. }
  221. .search_btn {
  222. width: 120rpx;
  223. height: 70rpx;
  224. line-height: 70rpx;
  225. padding: 0 24rpx;
  226. background: $theme-color;
  227. font-size: 32rpx;
  228. color: #fff;
  229. margin: 0;
  230. margin-left: 26rpx;
  231. }
  232. .menu_icon {
  233. width: 44rpx;
  234. height: 44rpx;
  235. margin-left: 14rpx;
  236. }
  237. }
  238. </style>