index.vue 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  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"> </NavBar>
  7. </el-col>
  8. <el-col :span="24" class="main">
  9. <el-tabs v-model="activeName" type="card">
  10. <el-tab-pane label="正在洽谈" name="first">
  11. <zzqt :zzqtList="zzqtList"></zzqt>
  12. </el-tab-pane>
  13. <el-tab-pane label="达成意向" name="second">
  14. <dcyx :dcyxList="dcyxList"></dcyx>
  15. </el-tab-pane>
  16. <el-tab-pane label="交易完成" name="third">
  17. <jywc :jywcList="jywcList"></jywc>
  18. </el-tab-pane>
  19. </el-tabs>
  20. </el-col>
  21. </el-col>
  22. </el-row>
  23. </div>
  24. </template>
  25. <script>
  26. import zzqt from './parts/zzqt.vue';
  27. import dcyx from './parts/dcyx.vue';
  28. import jywc from './parts/jywc.vue';
  29. import { mapState, createNamespacedHelpers } from 'vuex';
  30. import NavBar from '@/layout/common/topInfo.vue';
  31. const { mapActions: transaction } = createNamespacedHelpers('transaction');
  32. const { mapActions: dock } = createNamespacedHelpers('dock');
  33. export default {
  34. name: 'index',
  35. props: {},
  36. components: { NavBar, zzqt, dcyx, jywc },
  37. data: function() {
  38. return {
  39. // 头部标题
  40. title: '',
  41. // meta为true
  42. isleftarrow: '',
  43. // 返回
  44. navShow: true,
  45. activeName: 'first',
  46. zzqtList: [ ],
  47. dcyxList: [],
  48. jywcList: [],
  49. dock_id:''
  50. };
  51. },
  52. created() {
  53. this.searchInfo();
  54. },
  55. methods: {
  56. ...transaction({ transactionsfetch: 'fetch', transactionslist: 'query', transactiondetele: 'detele', transactionupdate: 'update' }),
  57. ...dock({ dockQuery: 'query', dockfetch: 'fetch',dockupdate:'update' }),
  58. async searchInfo({ skip = 0, limit = 10, ...info } = {}) {
  59. let res = await this.dockfetch(this.user.uid);
  60. this.$set(this, `dock_id`, res.data.id);
  61. let arr = await this.transactionslist({ skip, limit, dockid: this.dock_id, ...info });
  62. var zzqt = arr.data.filter(item => item.status === '0');
  63. var dcyx = arr.data.filter(item => item.status === '1');
  64. var jywc = arr.data.filter(item => item.status === '2');
  65. this.$set(this, `zzqtList`, zzqt);
  66. this.$set(this, `dcyxList`, dcyx);
  67. this.$set(this, `jywcList`, jywc);
  68. },
  69. },
  70. computed: { ...mapState(['user']) },
  71. mounted() {
  72. this.title = this.$route.meta.title;
  73. this.isleftarrow = this.$route.meta.isleftarrow;
  74. },
  75. };
  76. </script>
  77. <style lang="less" scoped>
  78. .style {
  79. width: 100%;
  80. min-height: 667px;
  81. position: relative;
  82. }
  83. .top {
  84. height: 46px;
  85. overflow: hidden;
  86. position: relative;
  87. z-index: 999;
  88. }
  89. .main {
  90. min-height: 570px;
  91. }
  92. </style>