release(custom): i

src/views/settlement/tx_list/index.vue

@@ -0,0 +1,194 @@
+<template>
+  <!-- <div> -->
+  <CommonPage show-footer :title="$route.title">
+    <div w-1200 flex items-center justify-between>
+      <n-card class="w-300">
+        <n-statistic label="可提现积分">
+          <n-number-animation
+            ref="numberAnimationInstRef"
+            :precision="2"
+            :from="0"
+            :to="userInfo.integral"
+          />
+        </n-statistic>
+      </n-card>
+      <div w-100 text-center text-25>/</div>
+      <n-card class="w-300">
+        <n-statistic label="兑换比例">
+          <n-number-animation ref="numberAnimationInstRef" :precision="2" :from="0" :to="100" />
+        </n-statistic>
+      </n-card>
+      <div w-100 text-center text-25>=</div>
+      <n-card class="w-300">
+        <n-statistic label="CNY">
+          <n-number-animation
+            ref="numberAnimationInstRef"
+            :precision="2"
+            :from="0"
+            :to="userInfo.integral / 100"
+          />
+        </n-statistic>
+      </n-card>
+      <div ml-10 flex flex-col items-center justify-center>
+        <n-input-number v-model:value="formData.integral" clearable placeholder="请输入提现积分" />
+        <n-button mt-10 w-full type="primary" @click="ok">立即提现</n-button>
+      </div>
+    </div>
+
+    <n-data-table
+      class="mt-10"
+      :loading="loading"
+      :columns="columns"
+      :data="data"
+      :pagination="pagination"
+      :bordered="false"
+      remote
+    />
+  </CommonPage>
+  <!-- </div> -->
+</template>
+
+<script setup>
+import api from './api'
+import comm from '@/api'
+import { NTag, NImage } from 'naive-ui'
+
+const loading = ref(false)
+const columns = ref([
+  {
+    title: 'ID',
+    key: 'ID',
+    align: 'center',
+  },
+
+  {
+    title: '提现积分',
+    key: 'integral',
+    align: 'center',
+  },
+  {
+    title: '银行名称',
+    key: 'bank',
+    align: 'center',
+  },
+  {
+    title: '银行卡号',
+    key: 'bank_card',
+    align: 'center',
+  },
+  {
+    title: '账户名称',
+    key: 'bank_name',
+    align: 'center',
+  },
+  {
+    title: '法人',
+    key: 'bank_user',
+    align: 'center',
+  },
+  {
+    title: '提现状态',
+    slot: 'status',
+    align: 'center',
+    render: (row) => {
+      return h(
+        NTag,
+        {
+          type: row.status === 1 ? 'success' : row.status === 2 ? 'error' : 'warning',
+        },
+        {
+          default: () => (row.status === 1 ? '已审核' : row.status === 2 ? '已拒绝' : '待审核'),
+        }
+      )
+    },
+  },
+  {
+    title: '提现时间',
+    slot: 'add_time',
+    align: 'center',
+    render: (row) => {
+      return h(
+        'span',
+        {},
+        {
+          default: () => row.add_time,
+        }
+      )
+    },
+  },
+  {
+    title: '打款截图',
+    slot: 'img',
+    render: (row) => {
+      return h(NImage, {
+        src: row.status_img,
+        width: '50',
+      })
+    },
+  },
+])
+const data = ref([])
+
+const formData = ref({
+  integral: null,
+})
+
+const pagination = ref({
+  page: 1,
+  pageSize: 10,
+  itemCount: 0,
+  onChange: (page) => {
+    pagination.value.page = page
+    getList()
+  },
+  onUpdatePageSize: (pageSize) => {
+    pagination.value.pageSize = pageSize
+    pagination.value.page = 1
+    getList()
+  },
+})
+
+onMounted(() => {
+  getList()
+  getData()
+})
+
+const userInfo = ref({})
+
+const getData = async () => {
+  const res = await comm.getMerchantInfo()
+  userInfo.value = res.data.data
+}
+
+const getList = async () => {
+  loading.value = true
+  try {
+    const res = await api.getList({
+      pageNum: pagination.value.page,
+      pageSize: pagination.value.pageSize,
+    })
+    data.value = res.data.data || []
+    pagination.value.itemCount = res.data.total
+  } catch (error) {
+    $message.error(error.msg)
+  }
+  loading.value = false
+}
+
+const ok = async () => {
+  //   if (formData.value.integral < 1000) return $message.warning('提现积分不能小于10000')
+  const res = await api.apply({
+    number: formData.value.integral,
+  })
+  $message.success(res.msg)
+  clear()
+}
+
+const clear = () => {
+  formData.value.integral = null
+  getList()
+  getData()
+}
+</script>
+
+<style lang="scss" scoped></style>