邃芒慧影、口播(PC) https://neuver.metavatar.cc/
Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.
 
 
 
 

147 рядки
3.3 KiB

  1. <template>
  2. <div class="page justify-around">
  3. <el-alert :title="`当前币值:${currentValue}`" type="success" :closable="false" />
  4. <el-table :data="tableData" style="width: 100%; height: 90%" size="large" align="center" border>
  5. <el-table-column
  6. prop="productTitle"
  7. label="名称"
  8. align="center"
  9. />
  10. <el-table-column
  11. prop="orderNumber"
  12. label="订单号"
  13. align="center"
  14. />
  15. <el-table-column
  16. prop="createTime"
  17. label="创建时间"
  18. align="center"
  19. >
  20. <template #default="scope">
  21. {{ getDate(scope.row.createTime) }}
  22. </template>
  23. </el-table-column>
  24. <el-table-column
  25. fixed="right"
  26. label="操作"
  27. align="center"
  28. >
  29. <template #default="scope">
  30. <el-button link type="primary" size="small">查看</el-button>
  31. </template>
  32. </el-table-column>
  33. </el-table>
  34. <div class="pagination">
  35. <el-pagination
  36. v-model:current-page="pageNum"
  37. v-model:page-size="pageSize"
  38. :page-sizes="[10, 50, 100]"
  39. :small="false"
  40. :disabled="false"
  41. :background="true"
  42. layout="total, sizes, prev, pager, next, jumper"
  43. :total="total"
  44. @size-change="handleSizeChange"
  45. @current-change="handleCurrentChange"
  46. />
  47. </div>
  48. <el-dialog v-model="dialogVisible" title="查看详情" width="40%" :before-close="handleClose" >
  49. <detail @close="handleClose"></detail>
  50. </el-dialog>
  51. </div>
  52. </template>
  53. <!-- videoType==1为竖,==2为横 -->
  54. <script setup>
  55. //#region 导入
  56. import { rechargeListApi, getDetailApi, getUserPoinsApi, coindedApi } from '@/apis/my.js'
  57. import dayjs from "dayjs";
  58. import detail from './detail.vue'
  59. const tableData = ref([]);
  60. const pageNum = ref(1);
  61. const pageSize = ref(10);
  62. const total = ref(0);
  63. const getDate = (val) => {
  64. return dayjs(val).format("YYYY-MM-DD");
  65. };
  66. const handleSizeChange = (val) => {
  67. pageSize.value = val;
  68. getListData(pageNum.value, pageSize.value);
  69. };
  70. const handleCurrentChange = (val) => {
  71. pageNum.value = val;
  72. getListData(pageNum.value, pageSize.value);
  73. };
  74. const getListData = async (PageNum, PageSize) => {
  75. try {
  76. let data = {
  77. projectType: 2,
  78. pageNum: 1,
  79. pageSize: 10
  80. }
  81. const res = await rechargeListApi(data);
  82. tableData.value = res.data.list;
  83. total.value = res.data.total * 1;
  84. } catch (error) {
  85. console.log(error, "err");
  86. }
  87. };
  88. // 当前币值
  89. const currentValue = ref('')
  90. function currentValFn() {
  91. getUserPoinsApi().then(res => {
  92. currentValue.value = res.data
  93. })
  94. }
  95. // 查看详情
  96. const dialogVisible = ref(false)
  97. onMounted(() => {
  98. getListData(1, 10);
  99. currentValFn()
  100. });
  101. </script>
  102. <style lang="scss" scoped>
  103. .page {
  104. height: calc(100vh - 80px);
  105. // height: calc(100vh - 80px);
  106. background-color: #ffffff;
  107. border-radius: 30px 0 0 0;
  108. overflow: hidden;
  109. padding: 10vh;
  110. .addbtn {
  111. margin-bottom: 2vh;
  112. }
  113. .formData {
  114. padding: 5vh 3vh;
  115. }
  116. .pagination {
  117. position: fixed;
  118. left: 55%;
  119. bottom: 8vh;
  120. transform: translateX(-50%);
  121. border-radius: 5px;
  122. padding: 10px 20px;
  123. z-index: 99;
  124. transition: all 0.3s;
  125. cursor: pointer;
  126. &:hover {
  127. background-color: #b8b8b873;
  128. }
  129. }
  130. }
  131. </style>