index.vue 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. <template>
  2. <view class="contract">
  3. <headContent :showleftRight="false">
  4. <template #content>
  5. <view class="navigation-box">
  6. <view :class="['navigation-item hide_1' , contractIndex === index ? 'active-navigation-item' : '']"
  7. v-for="(item , index) in contractArr" :key="`navigation_${index}`"
  8. @click.stop="contractIndex = index">
  9. {{ item }}
  10. </view>
  11. </view>
  12. </template>
  13. </headContent>
  14. <!-- 永续合约 -->
  15. <template v-if="contractIndex === 0">
  16. <sustainability ref="sustainabilityRef" :currency-info="currencyVal" :leverTransaction="lever_transaction"
  17. :pagesInfo="pagesInfo" :rate-profits-total="rate_profits_total" @refreshData="init"
  18. @setContract="setContract" @setProfitLoss="setProfitLoss" />
  19. </template>
  20. <!-- 永续合约 -->
  21. <template v-if="contractIndex === 1">
  22. <shortcut :leverTransaction="lever_transaction" :rate-profits-total="rate_profits_total"
  23. :pagesInfo="pagesInfo" @refreshData="init" />
  24. </template>
  25. <!-- 赠金交易 -->
  26. <template v-if="contractIndex === 2">
  27. <grants />
  28. </template>
  29. <notarize />
  30. <!-- 永续合约设置 -->
  31. <contract-set ref="contractSetRef" @confirm="openSet" />
  32. <!-- 偏好设置 -->
  33. <preference ref="preferenceRef" />
  34. <!-- 设置盈亏 -->
  35. <restrictPopup ref="restrictPopupRef" @setSuccess="setRestrictSuccess" />
  36. </view>
  37. </template>
  38. <script>
  39. import notarize from "./modules/notarize.vue"
  40. import sustainability from "./sustainability/index.vue"
  41. import grants from "./grants/index.vue"
  42. import shortcut from "./shortcut/index.vue"
  43. import preference from "@/components/contract-set/preference.vue"
  44. import {
  45. Api_getLeverDeal,
  46. Api_getRegister
  47. } from "@/api/index.js"
  48. import {
  49. Way_getUserInfo
  50. } from "@/utils/common-request.js"
  51. import {
  52. mapGetters
  53. } from 'vuex'
  54. import {
  55. startSocket,
  56. closeSocket
  57. } from "@/utils/websocket.js"
  58. import restrictPopup from "./modules/restrict.vue"
  59. export default {
  60. name: 'contract',
  61. components: {
  62. notarize,
  63. sustainability,
  64. grants,
  65. shortcut,
  66. preference,
  67. restrictPopup
  68. },
  69. data() {
  70. return {
  71. contractIndex: 0,
  72. contractArr: [
  73. '永续合约',
  74. '快捷合约',
  75. '赠金交易'
  76. ],
  77. currency: {},
  78. UserInfo: {},
  79. pagesInfo: {},
  80. lever_transaction: [],
  81. rate_profits_total: {}
  82. };
  83. },
  84. onLoad() {
  85. },
  86. computed: {
  87. ...mapGetters([
  88. 'currencyVal'
  89. ]),
  90. },
  91. watch: {
  92. currencyVal: {
  93. handler(newCurrency) {
  94. if (newCurrency && newCurrency?.legal_id) {
  95. this.init();
  96. }
  97. },
  98. deep: true,
  99. immediate: true
  100. },
  101. },
  102. onShow() {
  103. const nu = this.$getStorageSync('contractIndex');
  104. this.contractIndex = [0, 1, 2].includes(nu) ? nu : this.contractIndex
  105. this.$removeStorageSync('contractIndex')
  106. this.init()
  107. // this.setSocket();
  108. },
  109. onHide() {
  110. this.close()
  111. },
  112. mounted() {
  113. // 设置盈亏
  114. // setProfitLoss(item) {
  115. // console.log('setProfitLoss')
  116. // this.$nextTick(() => {
  117. // this.$refs.restrictPopupRef.open(item)
  118. // })
  119. // },
  120. // this.$on('setProfitLoss', (val) => {
  121. // console.log('setProfitLoss' , val);
  122. // });
  123. },
  124. methods: {
  125. init() {
  126. if ([0, 1].includes(this.contractIndex)) {
  127. // 永续 / 快捷 需要获取持仓信息
  128. this.getRegister()
  129. }
  130. this.getAccountInfo();
  131. this.$store.dispatch('websocket/getQuotationNew', {
  132. noRefresh: true
  133. })
  134. // 运行 socket 实时更新
  135. // this.$store.commit('websocket/set_socket_update_status', true)
  136. if (this.currencyVal && this.currencyVal?.legal_id) {
  137. this.getLeverDeal();
  138. this.setSocket();
  139. }
  140. },
  141. // 获取持仓信息(当前持仓)
  142. getRegister() {
  143. Api_getRegister({
  144. status: 1,
  145. page: 1,
  146. limit: 10000,
  147. settled: this.contractIndex === 0 ? 0 : 9
  148. }).then(res => {
  149. this.rate_profits_total = res.rate_profits_total
  150. }).catch(err => {
  151. // this.getRegister()
  152. })
  153. },
  154. setSocket() {
  155. startSocket({
  156. type: 'market_depth'
  157. });
  158. startSocket({
  159. type: 'daymarket'
  160. });
  161. // this.$store.dispatch("websocket/openSocket", {
  162. // ,
  163. // legal_id: this.currencyVal.legal_id,
  164. // currency_id: this.currencyVal.currency_id
  165. // })
  166. // this.$store.dispatch("websocket/openSocket", {
  167. // type: 'daymarket',
  168. // legal_id: this.currencyVal.legal_id,
  169. // currency_id: this.currencyVal.currency_id
  170. // })
  171. },
  172. getLeverDeal() {
  173. Api_getLeverDeal({
  174. legal_id: this.currencyVal.legal_id,
  175. currency_id: this.currencyVal.currency_id
  176. }).then(res => {
  177. this.pagesInfo = res
  178. this.lever_transaction = res.lever_transaction?.in || []
  179. }).catch(err => {
  180. // this.getLeverDeal()
  181. })
  182. },
  183. getAccountInfo() {
  184. this.$store.dispatch('possession/getPossession').then(res => {
  185. console.log('获取成功')
  186. }).catch(err => {
  187. console.log('获取shibai ')
  188. })
  189. },
  190. setContract() {
  191. // setContract
  192. this.$nextTick(() => {
  193. this.$refs.contractSetRef.open()
  194. })
  195. },
  196. // 设置盈亏
  197. setProfitLoss(item) {
  198. console.log('setProfitLoss')
  199. this.$nextTick(() => {
  200. this.$refs.restrictPopupRef.open(item)
  201. })
  202. },
  203. // 设置盈亏成功
  204. setRestrictSuccess() {
  205. this.getRegister();
  206. this.getLeverDeal();
  207. },
  208. // 永续合约 设置
  209. openSet(type) {
  210. return false
  211. switch (type) {
  212. case 1:
  213. // 偏好设置
  214. this.$nextTick(() => {
  215. this.$refs.preferenceRef.open()
  216. })
  217. break;
  218. case 2:
  219. // 合约计算器
  220. uni.navigateTo({
  221. url: '/pages/contract/calculator'
  222. })
  223. break;
  224. //
  225. }
  226. }
  227. }
  228. }
  229. </script>
  230. <style lang="scss" scoped>
  231. .navigation-box {
  232. width: 100%;
  233. height: 100%;
  234. padding: 0 $pages-padding 11rpx;
  235. display: flex;
  236. align-items: flex-end;
  237. .navigation-item {
  238. // width: 25%;
  239. flex: 1;
  240. flex-shrink: 0;
  241. text-align: center;
  242. height: 60rpx;
  243. border: 2rpx solid #27ae83;
  244. line-height: 60rpx;
  245. font-size: 28rpx;
  246. font-family: PingFang SC, PingFang SC-Regular;
  247. font-weight: 400;
  248. color: #05c175;
  249. &:nth-child(n + 2) {
  250. border-left: none;
  251. }
  252. &:last-child {
  253. border-radius: 0 6rpx 6rpx 0;
  254. }
  255. &:first-child {
  256. border-radius: 6rpx 0 0 6rpx;
  257. }
  258. }
  259. .active-navigation-item {
  260. background-color: #05C175;
  261. color: #FFFFFF;
  262. }
  263. }
  264. </style>