index.vue 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <template>
  2. <div id="index">
  3. <el-row>
  4. <el-col :span="24" class="style">
  5. <el-col :span="24" class="top">
  6. <NavBar v-show="navShow" :title="title" :isleftarrow="isleftarrow" @onClickLeft="onClickLeft"> </NavBar>
  7. </el-col>
  8. <el-col :span="24" class="main">
  9. <van-tabs v-model="active">
  10. <van-tab title="我的全部">
  11. <list :list="oneList" status="3" @query="search" @checkBtn="checkBtn"></list>
  12. </van-tab>
  13. <van-tab title="我的洽谈">
  14. <list :list="twoList" status="0" @query="search" @checkBtn="checkBtn"></list>
  15. </van-tab>
  16. <van-tab title="我的意向">
  17. <list :list="threeList" status="1" @query="search" @checkBtn="checkBtn"></list>
  18. </van-tab>
  19. <van-tab title="我的交易">
  20. <list :list="fourList" status="2" @query="search" @checkBtn="checkBtn"></list>
  21. </van-tab>
  22. </van-tabs>
  23. </el-col>
  24. </el-col>
  25. </el-row>
  26. </div>
  27. </template>
  28. <script>
  29. import list from './parts/list.vue';
  30. import NavBar from '@/layout/common/topInfo.vue';
  31. import { mapState, createNamespacedHelpers } from 'vuex';
  32. const { mapActions: transaction } = createNamespacedHelpers('transaction');
  33. export default {
  34. name: 'index',
  35. props: {},
  36. components: {
  37. NavBar,
  38. list,
  39. },
  40. data: function() {
  41. return {
  42. // 头部标题
  43. title: '',
  44. // meta为true
  45. isleftarrow: '',
  46. // 返回
  47. navShow: true,
  48. active: 0,
  49. oneList: [],
  50. twoList: [],
  51. threeList: [],
  52. fourList: [],
  53. };
  54. },
  55. async created() {
  56. await this.search({ status: '3' });
  57. await this.search({ status: '0' });
  58. await this.search({ status: '1' });
  59. await this.search({ status: '2' });
  60. },
  61. methods: {
  62. ...transaction({ transactionsfetch: 'fetch', transactionslist: 'query', transactiondetele: 'detele', shenheupdate: 'update' }),
  63. async search({ skip = 0, status, ...info } = {}) {
  64. let userid = this.user.uid;
  65. let market_userid = this.user.uid;
  66. if (status == '3') {
  67. const res = await this.transactionslist({ skip, userid, ...info });
  68. const arr = await this.transactionslist({ skip, market_userid, ...info });
  69. var newData = res.data.concat(arr.data);
  70. if (this.$checkRes(newData)) {
  71. this.$set(this, `oneList`, newData);
  72. }
  73. } else if (status == '0') {
  74. const res = await this.transactionslist({ skip, userid, status: '0', ...info });
  75. const arr = await this.transactionslist({ skip, market_userid, status: '0', ...info });
  76. var newData = res.data.concat(arr.data);
  77. if (this.$checkRes(res)) {
  78. this.$set(this, `twoList`, newData);
  79. }
  80. } else if (status == '1') {
  81. const res = await this.transactionslist({ skip, userid, status: '1', ...info });
  82. const arr = await this.transactionslist({ skip, market_userid, status: '4', ...info });
  83. var newData = res.data.concat(arr.data);
  84. if (this.$checkRes(newData)) {
  85. this.$set(this, `threeList`, newData);
  86. }
  87. } else if (status == '2') {
  88. const res = await this.transactionslist({ skip, userid, status: '2', ...info });
  89. const arr = await this.transactionslist({ skip, market_userid, status: '2', ...info });
  90. var newData = res.data.concat(arr.data);
  91. if (this.$checkRes(newData)) {
  92. this.$set(this, `fourList`, newData);
  93. }
  94. }
  95. },
  96. // 交易按钮
  97. async checkBtn(data) {
  98. // 同意交易%交易完成
  99. if (data.status == '0') {
  100. data.status = '1';
  101. let res = await this.shenheupdate(data);
  102. this.$notify({
  103. message: ' 同意交易成功',
  104. type: 'success',
  105. });
  106. this.searchevery();
  107. } else if (data.status == '1') {
  108. this.$router.push({ path: '/viewTwo/userCenter/matter/detail', query: { id: data.id } });
  109. }
  110. },
  111. // 提交刷新
  112. searchevery() {
  113. this.search({ status: '3' });
  114. this.search({ status: '0' });
  115. this.search({ status: '1' });
  116. this.search({ status: '2' });
  117. },
  118. // 返回
  119. onClickLeft() {
  120. this.$router.push({ path: '/viewTwo/account/index' });
  121. },
  122. },
  123. computed: {
  124. ...mapState(['user']),
  125. },
  126. mounted() {
  127. this.title = this.$route.meta.title;
  128. this.isleftarrow = this.$route.meta.isleftarrow;
  129. },
  130. metaInfo() {
  131. return { title: this.$route.meta.title };
  132. },
  133. };
  134. </script>
  135. <style lang="less" scoped>
  136. .style {
  137. width: 100%;
  138. min-height: 667px;
  139. position: relative;
  140. background-color: #f9fafc;
  141. }
  142. .top {
  143. height: 46px;
  144. overflow: hidden;
  145. }
  146. .main {
  147. min-height: 570px;
  148. }
  149. </style>