|
|
@ -1,8 +1,6 @@ |
|
|
|
<script setup> |
|
|
|
import { ref, onMounted, computed, reactive } from 'vue' |
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus' |
|
|
|
import axios from 'axios' |
|
|
|
import { createApp } from 'vue' |
|
|
|
import {onMounted, reactive, ref} from 'vue' |
|
|
|
import {ElMessage, ElMessageBox} from 'element-plus' |
|
|
|
import moment from 'moment' |
|
|
|
|
|
|
|
import _ from 'lodash' |
|
|
@ -22,7 +20,6 @@ const getAdminData = async function () { |
|
|
|
rateAdd.value.adminId = adminData.value.adminId |
|
|
|
rateEdit.value.adminId = adminData.value.adminId |
|
|
|
console.log('请求成功', result) |
|
|
|
// console.log('用户信息', user.value) |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
} |
|
|
@ -31,6 +28,8 @@ getAdminData() |
|
|
|
|
|
|
|
const regeAdd = ref(false) |
|
|
|
const regeEdit = ref(false) |
|
|
|
// 表单引用 |
|
|
|
const editFormRef = ref(null) |
|
|
|
//汇率表格数据 |
|
|
|
const tableData = ref([]) |
|
|
|
//搜索对象 |
|
|
@ -51,33 +50,8 @@ const formatDateTime = (date) => { |
|
|
|
return moment(date).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
} |
|
|
|
|
|
|
|
// 今天 |
|
|
|
const getToday = () => { |
|
|
|
const today = new Date() |
|
|
|
const start = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0) |
|
|
|
const end = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1, 0, 0, 0) |
|
|
|
timeRange.value = [formatDateTime(start), formatDateTime(end)] |
|
|
|
search() |
|
|
|
} |
|
|
|
|
|
|
|
// 昨天 |
|
|
|
const getYesterday = () => { |
|
|
|
const yesterday = new Date() |
|
|
|
yesterday.setDate(yesterday.getDate() - 1) |
|
|
|
const start = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate(), 0, 0, 0) |
|
|
|
const end = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate() + 1, 0, 0, 0) |
|
|
|
timeRange.value = [formatDateTime(start), formatDateTime(end)] |
|
|
|
search() |
|
|
|
} |
|
|
|
|
|
|
|
// 近 7 天 |
|
|
|
const get7Days = () => { |
|
|
|
const today = new Date() |
|
|
|
const start = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 6, 0, 0, 0) |
|
|
|
const end = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 1, 0, 0, 0) |
|
|
|
timeRange.value = [formatDateTime(start), formatDateTime(end)] |
|
|
|
search() |
|
|
|
} |
|
|
|
// const startTime = ref('2023-01-01 00:00:00') |
|
|
|
// const endTime = ref('2025-12-31 23:59:59') |
|
|
|
|
|
|
|
const get = async function (val) { |
|
|
|
try { |
|
|
@ -91,14 +65,14 @@ const get = async function (val) { |
|
|
|
if (timeRange.value.length === 2) { |
|
|
|
time.startTime = moment(timeRange.value[0]).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
time.endTime = moment(timeRange.value[1]).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
} else { |
|
|
|
time.startTime = '' |
|
|
|
time.endTime = '' |
|
|
|
} else { // 这是对时间的模拟,根据需求不需要传时间 |
|
|
|
time.startTime = '2023-01-01 00:00:00' |
|
|
|
time.endTime = '2025-12-31 23:59:59' |
|
|
|
} |
|
|
|
|
|
|
|
console.log('搜索参数', { |
|
|
|
...getObj.value, |
|
|
|
rate: { ...time } |
|
|
|
rate: {...time} |
|
|
|
}); |
|
|
|
// 发送POST请求 |
|
|
|
const result = await request({ |
|
|
@ -106,7 +80,7 @@ const get = async function (val) { |
|
|
|
method: 'POST', |
|
|
|
data: { |
|
|
|
...getObj.value, |
|
|
|
rate: { ...time } |
|
|
|
rate: {...time} |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
@ -114,10 +88,8 @@ const get = async function (val) { |
|
|
|
console.log('请求成功', result); |
|
|
|
// 存储表格数据 |
|
|
|
tableData.value = result.data.list; |
|
|
|
console.log('tableData', tableData.value); |
|
|
|
// 存储分页总条目 |
|
|
|
total.value = result.data.total; |
|
|
|
console.log('total', total.value); |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error); |
|
|
|
ElMessage.error('请求失败'); |
|
|
@ -137,14 +109,14 @@ const addRate = async function () { |
|
|
|
const date = new Date(rateAdd.value.startTime) |
|
|
|
date.setHours(0, 0, 0, 0) |
|
|
|
rateAdd.value.startTime = `${date.getFullYear()}-${String( |
|
|
|
date.getMonth() + 1 |
|
|
|
date.getMonth() + 1 |
|
|
|
).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} 00:00:00` |
|
|
|
} |
|
|
|
if (rateAdd.value.endTime) { |
|
|
|
const date = new Date(rateAdd.value.endTime) |
|
|
|
date.setHours(23, 59, 59, 999) |
|
|
|
rateAdd.value.endTime = `${date.getFullYear()}-${String( |
|
|
|
date.getMonth() + 1 |
|
|
|
date.getMonth() + 1 |
|
|
|
).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} 23:59:59` |
|
|
|
} |
|
|
|
try { |
|
|
@ -156,7 +128,7 @@ const addRate = async function () { |
|
|
|
}) |
|
|
|
if (result.code == 0) { |
|
|
|
ElMessage.error(result.msg) |
|
|
|
}else{ |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
type: 'success', |
|
|
|
message: '新增汇率成功' |
|
|
@ -167,7 +139,6 @@ const addRate = async function () { |
|
|
|
get() |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
@ -175,18 +146,18 @@ const add = () => { |
|
|
|
Ref.value.validate(async (valid) => { |
|
|
|
if (valid) { |
|
|
|
ElMessageBox.confirm('确认添加?') |
|
|
|
.then(() => { |
|
|
|
addRate() |
|
|
|
rateAdd.value = {} |
|
|
|
timeRange.value = { |
|
|
|
startTime: '', |
|
|
|
endTime: '' |
|
|
|
} |
|
|
|
regeAdd.value = false |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
regeAdd.value = false |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
addRate() |
|
|
|
rateAdd.value = {} |
|
|
|
timeRange.value = { |
|
|
|
startTime: '', |
|
|
|
endTime: '' |
|
|
|
} |
|
|
|
regeAdd.value = false |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
regeAdd.value = false |
|
|
|
}) |
|
|
|
} else { |
|
|
|
//提示 |
|
|
|
ElMessage({ |
|
|
@ -205,11 +176,16 @@ const handleCurrentChange = function (val) { |
|
|
|
get() |
|
|
|
} |
|
|
|
// 使用 _.throttle 并设置 trailing 为 false 实现严格节流,只执行一次 |
|
|
|
const throttledAdd = _.throttle(add, 5000, { trailing: false }) |
|
|
|
const throttledAdd = _.throttle(add, 5000, {trailing: false}) |
|
|
|
// 编辑方法 |
|
|
|
const rateEdit = ref({}) |
|
|
|
//查询已有的数据 |
|
|
|
const getEditData = async function (row) { |
|
|
|
// 重置表单 |
|
|
|
if (editFormRef.value) { |
|
|
|
editFormRef.value.resetFields() |
|
|
|
} |
|
|
|
|
|
|
|
try { |
|
|
|
console.log('搜索参数', getObj.value) |
|
|
|
// 发送POST请求 |
|
|
@ -224,10 +200,8 @@ const getEditData = async function (row) { |
|
|
|
|
|
|
|
rateEdit.value = result.data |
|
|
|
rateEdit.value.adminId = adminData.value.adminId |
|
|
|
console.log('这是编辑的数值', rateEdit.value) |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
} |
|
|
|
} |
|
|
|
const editRate = async function () { |
|
|
@ -235,14 +209,14 @@ const editRate = async function () { |
|
|
|
const date = new Date(rateEdit.value.startTime) |
|
|
|
date.setHours(0, 0, 0, 0) |
|
|
|
rateEdit.value.startTime = `${date.getFullYear()}-${String( |
|
|
|
date.getMonth() + 1 |
|
|
|
date.getMonth() + 1 |
|
|
|
).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} 00:00:00` |
|
|
|
} |
|
|
|
if (rateEdit.value.endTime) { |
|
|
|
const date = new Date(rateEdit.value.endTime) |
|
|
|
date.setHours(23, 59, 59, 999) |
|
|
|
rateEdit.value.endTime = `${date.getFullYear()}-${String( |
|
|
|
date.getMonth() + 1 |
|
|
|
date.getMonth() + 1 |
|
|
|
).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} 23:59:59` |
|
|
|
} |
|
|
|
try { |
|
|
@ -257,34 +231,30 @@ const editRate = async function () { |
|
|
|
get() |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
} |
|
|
|
} |
|
|
|
const edit = () => { |
|
|
|
ElMessageBox.confirm('确认修改?') |
|
|
|
.then(() => { |
|
|
|
editRate() |
|
|
|
regeEdit.value = false |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
regeEdit.value = false |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
editRate() |
|
|
|
regeEdit.value = false |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
regeEdit.value = false |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
// 删除方法 |
|
|
|
const deleteRate = async function (row) { |
|
|
|
try { |
|
|
|
// 发送POST请求 |
|
|
|
const result = await request({ |
|
|
|
url: '/rates/delete/ ' + row.rateId, |
|
|
|
data: {} |
|
|
|
}) |
|
|
|
// 将响应结果存储到响应式数据中 |
|
|
|
console.log('请求成功', result) |
|
|
|
get() |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
// 关闭编辑弹窗时重置表单 |
|
|
|
const cancelEdit = () => { |
|
|
|
regeEdit.value = false |
|
|
|
if (editFormRef.value) { |
|
|
|
editFormRef.value.resetFields() |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
const handleEditDialogClose = () => { |
|
|
|
if (editFormRef.value) { |
|
|
|
editFormRef.value.resetFields() |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
@ -292,10 +262,12 @@ const deleteRate = async function (row) { |
|
|
|
onMounted(async function () { |
|
|
|
get() |
|
|
|
}) |
|
|
|
|
|
|
|
//分页 |
|
|
|
function handlePageChange(currentPage, pageSize) { |
|
|
|
get() |
|
|
|
} |
|
|
|
|
|
|
|
//货币条目 |
|
|
|
const options = [ |
|
|
|
{ |
|
|
@ -347,6 +319,7 @@ function formatDate(value) { |
|
|
|
const seconds = date.getSeconds().toString().padStart(2, '0') |
|
|
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}` |
|
|
|
} |
|
|
|
|
|
|
|
function formatDateTwe(value) { |
|
|
|
if (!value) return '' |
|
|
|
const date = new Date(value) |
|
|
@ -356,11 +329,6 @@ function formatDateTwe(value) { |
|
|
|
return `${year}-${month}-${day}` |
|
|
|
} |
|
|
|
|
|
|
|
// //表格高度 |
|
|
|
// const tableHeight = computed(function () { |
|
|
|
// return (getObj.value.pageSize + 1) * 50 + "px"; |
|
|
|
// }); |
|
|
|
|
|
|
|
// 新增数据规则 |
|
|
|
// 表单验证ref |
|
|
|
const Ref = ref(null) |
|
|
@ -393,172 +361,94 @@ const checkFreeGoldRadio = function (rule, value, callback) { |
|
|
|
} |
|
|
|
} |
|
|
|
const rules = reactive({ |
|
|
|
currency: [{ required: true, message: '请选择货币名称', trigger: 'blur' }], |
|
|
|
exchangeRate: [{ validator: checkFreeGoldRadio, trigger: 'blur' }], |
|
|
|
startTime: [ |
|
|
|
{ required: true, message: '请选择开始时间', trigger: 'blur' }, |
|
|
|
{ validator: checkStartTime, trigger: 'blur' } |
|
|
|
], |
|
|
|
endTime: [ |
|
|
|
{ required: true, message: '请选择结束时间', trigger: 'blur' }, |
|
|
|
{ validator: checkEndTime, trigger: 'blur' } |
|
|
|
] |
|
|
|
currency: [{required: true, message: '请选择货币名称', trigger: 'blur'}], |
|
|
|
exchangeRate: [{validator: checkFreeGoldRadio, trigger: 'blur'}], |
|
|
|
// startTime: [ |
|
|
|
// {required: true, message: '请选择开始时间', trigger: 'blur'}, |
|
|
|
// {validator: checkStartTime, trigger: 'blur'} |
|
|
|
// ], |
|
|
|
// endTime: [ |
|
|
|
// {required: true, message: '请选择结束时间', trigger: 'blur'}, |
|
|
|
// {validator: checkEndTime, trigger: 'blur'} |
|
|
|
// ] |
|
|
|
}) |
|
|
|
|
|
|
|
// 重置的按钮 |
|
|
|
const handledelete = function () { |
|
|
|
timeRange.value={} |
|
|
|
getObj.value.pageNum = 1 |
|
|
|
} |
|
|
|
// 验证跳转输入框的数字是否合法 |
|
|
|
const checkNumber = function () { |
|
|
|
if (typeof parseInt(getObj.value.pageNum) === 'number') { |
|
|
|
console.log('总共有多少页' + Math.ceil(total.value / getObj.value.pageSize)) |
|
|
|
if ( |
|
|
|
getObj.value.pageNum > 0 && |
|
|
|
getObj.value.pageNum <= Math.ceil(total.value / getObj.value.pageSize) |
|
|
|
) { |
|
|
|
getObj.value.pageNum = parseInt(getObj.value.pageNum) |
|
|
|
console.log('输入的数字合法') |
|
|
|
get() |
|
|
|
} else { |
|
|
|
//提示 |
|
|
|
ElMessage({ |
|
|
|
type: 'error', |
|
|
|
message: '请检查输入内容' |
|
|
|
}) |
|
|
|
} |
|
|
|
} else { |
|
|
|
//提示 |
|
|
|
ElMessage({ |
|
|
|
type: 'error', |
|
|
|
message: '请检查输入内容' |
|
|
|
}) |
|
|
|
// 这是限制输入小数不超过七位并验证格式的方法 |
|
|
|
function handleInput(value) { |
|
|
|
// 检测是否包含非法符号 |
|
|
|
const invalidChars = /[^0-9.]/.test(value); |
|
|
|
if (invalidChars) { |
|
|
|
ElMessage.warning('只能输入数字和小数点'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 删除========================================================= |
|
|
|
// 删除按钮 |
|
|
|
// 过滤非法字符,只保留数字、小数点 |
|
|
|
let validValue = value.replace(/[^\d.]/g, ''); |
|
|
|
|
|
|
|
// 删除按钮的气泡弹出框确认按钮 |
|
|
|
const delConfirm = async function (row) { |
|
|
|
try { |
|
|
|
// 发送POST请求 |
|
|
|
const result = await request({ |
|
|
|
url: '/rates/delete/ ' + row.rateId, |
|
|
|
data: {} |
|
|
|
}) |
|
|
|
if (result.code == 200) { |
|
|
|
ElMessage({ |
|
|
|
type: 'success', |
|
|
|
message: '删除成功' |
|
|
|
}) |
|
|
|
// 将响应结果存储到响应式数据中 |
|
|
|
console.log('请求成功', result) |
|
|
|
// 刷新表格数据 |
|
|
|
get() |
|
|
|
} else { |
|
|
|
ElMessage({ |
|
|
|
type: 'error', |
|
|
|
message: '删除失败' |
|
|
|
}) |
|
|
|
} |
|
|
|
} catch (error) { |
|
|
|
console.log('请求失败', error) |
|
|
|
// 在这里可以处理错误逻辑,比如显示错误提示等 |
|
|
|
// 确保只有一个小数点 |
|
|
|
validValue = validValue.replace(/\.{2,}/g, '.'); |
|
|
|
|
|
|
|
// 限制只能有一个小数点 |
|
|
|
if (validValue.split('.').length > 2) { |
|
|
|
validValue = validValue.replace(/\.$/, ''); |
|
|
|
ElMessage.warning('注意!只能使用一个小数点'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
//这是限制输入小数不超过七位的限制方法 |
|
|
|
function handleInput(value) { |
|
|
|
// 限制小数点后7位,这里使用正则表达式来实现 |
|
|
|
rateAdd.value.exchangeRate = value |
|
|
|
.replace(/(\.\d{7})\d+/, '$1') |
|
|
|
.replace(/^(\d+)(\.\d{0,7})?$/, '$1$2') |
|
|
|
// 限制小数点后7位 |
|
|
|
const originalDecimalPart = validValue.split('.')[1] || ''; |
|
|
|
validValue = validValue.replace(/(\.\d{7})\d+/, '$1'); |
|
|
|
|
|
|
|
// 如果截断了小数部分,提示用户 |
|
|
|
const newDecimalPart = validValue.split('.')[1] || ''; |
|
|
|
if (originalDecimalPart.length > 7 && originalDecimalPart !== newDecimalPart) { |
|
|
|
ElMessage.warning('最多只能输入7位小数'); |
|
|
|
} |
|
|
|
|
|
|
|
// 根据需求这里先不用,这里是用防御性编程,直接不允许输入,先留一下,之后可能用 |
|
|
|
// 应用最终处理后的值 |
|
|
|
// rateAdd.value.exchangeRate = validValue; |
|
|
|
// rateEdit.value.exchangeRate = validValue; |
|
|
|
|
|
|
|
// 验证最终格式 |
|
|
|
if (validValue && !/^\d+(\.\d{0,7})?$/.test(validValue)) { |
|
|
|
ElMessage.warning('请输入正确的数字格式'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 表单大小 |
|
|
|
const formSize = ref('default') |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<template> |
|
|
|
<!-- 这是主页面 --> |
|
|
|
<el-row> |
|
|
|
<el-col> |
|
|
|
<el-card> |
|
|
|
<!-- 这是时间 --> |
|
|
|
<div class="demo-range"> |
|
|
|
<el-row> |
|
|
|
<el-col :span="9"> |
|
|
|
<el-form-item> |
|
|
|
<el-text class="mx-1" size="large">时间范围:</el-text> |
|
|
|
<el-date-picker |
|
|
|
v-model="timeRange" |
|
|
|
type="datetimerange" |
|
|
|
range-separator="至" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
style="width: 300px" |
|
|
|
format="YYYY-MM-DD HH:mm:ss" |
|
|
|
value-format="YYYY-MM-DD HH:mm:ss" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
</el-col> |
|
|
|
<el-col :span="4"> |
|
|
|
<el-button @click="getToday">今</el-button> |
|
|
|
<el-button @click="getYesterday">昨</el-button> |
|
|
|
<el-button @click="get7Days">近7天</el-button> |
|
|
|
</el-col> |
|
|
|
<el-col :span="4"> |
|
|
|
<el-button |
|
|
|
class="button-item" |
|
|
|
type="success" |
|
|
|
@click="handledelete()" |
|
|
|
>重置</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@click="search" |
|
|
|
>查询</el-button> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<el-row> |
|
|
|
<el-col> |
|
|
|
<el-card class="box-card" style="max-width: 100%"> |
|
|
|
<!-- 添加 --> |
|
|
|
<div class="add-item"> |
|
|
|
<el-button |
|
|
|
style="color: #048efb; border: 1px solid #048efb" |
|
|
|
@click="regeAdd = true" |
|
|
|
>新增汇率</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
<!-- 表格 --> |
|
|
|
<div> |
|
|
|
<!-- 这里有个小bug,应该是>0--> |
|
|
|
<el-table |
|
|
|
:data="tableData" |
|
|
|
v-if="(tableData.flag = 1)" |
|
|
|
:height="tableHeight" |
|
|
|
style="width: 100%" |
|
|
|
:data="tableData" |
|
|
|
v-if="(tableData.flag = 1)" |
|
|
|
> |
|
|
|
<el-table-column |
|
|
|
type="index" |
|
|
|
label="序号" |
|
|
|
width="100px" |
|
|
|
fixed="left" |
|
|
|
type="index" |
|
|
|
label="序号" |
|
|
|
width="100px" |
|
|
|
fixed="left" |
|
|
|
> |
|
|
|
<template #default="scope"> |
|
|
|
<span>{{ |
|
|
|
scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize |
|
|
|
}}</span> |
|
|
|
scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize |
|
|
|
}}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="currency" label="货币名称" :span="2" /> |
|
|
|
<el-table-column prop="currency" label="货币名称" :span="2"/> |
|
|
|
<el-table-column prop="exchangeRate" label="汇率" :span="2"> |
|
|
|
<template #default="scope"> |
|
|
|
<p> |
|
|
|
{{ scope.row.exchangeRate }}{{ scope.row.currency }} :1新币 |
|
|
|
{{ scope.row.exchangeRate }} :1 |
|
|
|
</p> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
@ -568,66 +458,19 @@ function handleInput(value) { |
|
|
|
<span>{{ formatDate(scope.row.createTime) }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="adminName" label="提交人" :span="1" /> |
|
|
|
<el-table-column prop="status" label="状态"> |
|
|
|
<template #default="scope"> |
|
|
|
<span v-if="scope.row.status === 1"> |
|
|
|
<div class="status"> |
|
|
|
<span class="green-dot"></span> |
|
|
|
<span>使用中</span> |
|
|
|
</div> |
|
|
|
</span> |
|
|
|
<span v-if="scope.row.status === 0"> |
|
|
|
<div class="status"> |
|
|
|
<span class="red-dot"></span> |
|
|
|
<span>未开始</span> |
|
|
|
</div> |
|
|
|
</span> |
|
|
|
<span v-if="scope.row.status === 2"> |
|
|
|
<div class="status"> |
|
|
|
<span class="grey-dot"></span> |
|
|
|
<span>已过期</span> |
|
|
|
</div> |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="startTime" label="持续时间" :span="10"> |
|
|
|
<template #default="scope"> |
|
|
|
<span>{{ formatDateTwe(scope.row.startTime) }}</span> |
|
|
|
<span>---</span> |
|
|
|
<span>{{ formatDateTwe(scope.row.endTime) }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" :span="3"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-button |
|
|
|
type="text" |
|
|
|
@click=" |
|
|
|
type="text" |
|
|
|
@click=" |
|
|
|
() => { |
|
|
|
regeEdit = true |
|
|
|
getEditData(scope.row) |
|
|
|
} |
|
|
|
" |
|
|
|
>编辑</el-button |
|
|
|
>编辑 |
|
|
|
</el-button |
|
|
|
> |
|
|
|
<el-popconfirm |
|
|
|
title="确定将此条活动删除吗?" |
|
|
|
@confirm="delConfirm" |
|
|
|
> |
|
|
|
<template #reference> |
|
|
|
<el-button type="primary" text> 删除 </el-button> |
|
|
|
</template> |
|
|
|
<template #actions="{ confirm, cancel }"> |
|
|
|
<el-button size="small" @click="cancel">取消</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
@click="confirm(scope.row)" |
|
|
|
> |
|
|
|
确定 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</el-popconfirm> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
@ -635,160 +478,73 @@ function handleInput(value) { |
|
|
|
<!-- 分页 --> |
|
|
|
<div class="pagination"> |
|
|
|
<el-pagination |
|
|
|
background |
|
|
|
:page-size="getObj.pageSize" |
|
|
|
:page-sizes="[5, 10, 20, 50, 100]" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
@size-change="handlePageSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
background |
|
|
|
:page-size="getObj.pageSize" |
|
|
|
:page-sizes="[5, 10, 20, 50, 100]" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
@size-change="handlePageSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
></el-pagination> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
<!-- 这是添加弹窗 --> |
|
|
|
<!-- 这是编辑弹窗 --> |
|
|
|
<el-dialog |
|
|
|
v-model="regeAdd" |
|
|
|
title="新增汇率" |
|
|
|
width="500" |
|
|
|
:close-on-click-modal="false" |
|
|
|
v-model="regeEdit" |
|
|
|
title="修改汇率" |
|
|
|
width="500" |
|
|
|
:close-on-click-modal="false" |
|
|
|
@close="handleEditDialogClose" |
|
|
|
> |
|
|
|
<template #footer> |
|
|
|
<el-form |
|
|
|
ref="Ref" |
|
|
|
style="max-width: 600px" |
|
|
|
:model="rateAdd" |
|
|
|
:rules="rules" |
|
|
|
label-width="auto" |
|
|
|
class="demo-ruleForm" |
|
|
|
:size="formSize" |
|
|
|
status-icon |
|
|
|
ref="editFormRef" |
|
|
|
style="max-width: 600px" |
|
|
|
:model="rateEdit" |
|
|
|
:rules="rules" |
|
|
|
label-width="auto" |
|
|
|
class="demo-ruleForm" |
|
|
|
:size="formSize" |
|
|
|
status-icon |
|
|
|
> |
|
|
|
<el-form-item prop="currency" label="货币名称:"> |
|
|
|
<el-select |
|
|
|
v-model.number="rateAdd.currency" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 240px" |
|
|
|
v-model="rateEdit.currency" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 240px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="exchangeRate" label="汇率:"> |
|
|
|
<el-input |
|
|
|
v-model="rateAdd.exchangeRate" |
|
|
|
@update:modelValue="handleInput" |
|
|
|
style="width: 120px" |
|
|
|
v-model="rateEdit.exchangeRate" |
|
|
|
@update:modelValue="handleInput" |
|
|
|
style="width: 120px" |
|
|
|
/> |
|
|
|
<p class="unit">:1</p> |
|
|
|
<p> |
|
|
|
(提示:当前规则每 {{ rateAdd.exchangeRate }} |
|
|
|
{{ rateAdd.currency }}可兑换 1 新币) |
|
|
|
</p> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="adminId" label="提交人:"> |
|
|
|
<el-input :value="adminData.name" disabled style="width: 240px" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="startTime" label="开始时间:"> |
|
|
|
<el-date-picker |
|
|
|
v-model="rateAdd.startTime" |
|
|
|
type="date" |
|
|
|
placeholder="请选择时间" |
|
|
|
:default-value="new Date()" |
|
|
|
@change="handleStartTimeChange" |
|
|
|
value-format="YYYY-MM-DD" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="endTime" label="结束时间:"> |
|
|
|
<el-date-picker |
|
|
|
v-model="rateAdd.endTime" |
|
|
|
type="date" |
|
|
|
placeholder="请选择时间" |
|
|
|
:default-value="new Date()" |
|
|
|
value-format="YYYY-MM-DD" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<div class="dialog-footer"> |
|
|
|
<el-button type="primary" @click="throttledAdd">添加</el-button> |
|
|
|
<el-button @click="regeAdd = false">取消</el-button> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
<!-- 这是编辑弹窗 --> |
|
|
|
<el-dialog |
|
|
|
v-model="regeEdit" |
|
|
|
title="修改汇率" |
|
|
|
width="500" |
|
|
|
:close-on-click-modal="false" |
|
|
|
> |
|
|
|
<template #footer> |
|
|
|
<el-form |
|
|
|
ref="ruleFormRef" |
|
|
|
style="max-width: 600px" |
|
|
|
:model="rateEdit" |
|
|
|
:rules="rules" |
|
|
|
label-width="auto" |
|
|
|
class="demo-ruleForm" |
|
|
|
:size="formSize" |
|
|
|
status-icon |
|
|
|
> |
|
|
|
<el-form-item label="货币名称:"> |
|
|
|
<el-select |
|
|
|
v-model="rateEdit.currency" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 240px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
/> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="汇率:"> |
|
|
|
<el-input v-model="rateEdit.exchangeRate" style="width: 120px" /> |
|
|
|
<p class="unit">:1</p> |
|
|
|
<p> |
|
|
|
(提示:当前规则每 {{ rateEdit.exchangeRate }} |
|
|
|
{{ rateEdit.currency }}可兑换 1 新币) |
|
|
|
<p class="rate-tip"> |
|
|
|
(提示:当前规则每 |
|
|
|
<span>{{ rateEdit.exchangeRate }}</span> |
|
|
|
<span>{{ rateEdit.currency }}</span> |
|
|
|
可兑换 1 新币) |
|
|
|
</p> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="提交人:"> |
|
|
|
<el-input disabled :value="adminData.name" style="width: 240px" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="开始时间:"> |
|
|
|
<el-date-picker |
|
|
|
v-model="rateEdit.startTime" |
|
|
|
type="date" |
|
|
|
placeholder="请选择时间" |
|
|
|
:default-value="new Date()" |
|
|
|
value-format="YYYY-MM-DD" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="结束时间:"> |
|
|
|
<el-date-picker |
|
|
|
v-model="rateEdit.endTime" |
|
|
|
type="date" |
|
|
|
placeholder="请选择时间" |
|
|
|
:default-value="new Date()" |
|
|
|
value-format="YYYY-MM-DD" |
|
|
|
/> |
|
|
|
<el-input disabled :value="adminData.name" style="width: 240px"/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<div class="dialog-footer"> |
|
|
|
<el-button type="primary" @click="edit">修改</el-button> |
|
|
|
<el-button @click="regeEdit = false">取消</el-button> |
|
|
|
<el-button @click="cancelEdit">取消</el-button> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
@ -796,6 +552,7 @@ function handleInput(value) { |
|
|
|
</el-dialog> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
|
p { |
|
|
|
margin: 0px; |
|
|
@ -840,10 +597,16 @@ p { |
|
|
|
.el-card { |
|
|
|
padding: 0px; |
|
|
|
} |
|
|
|
|
|
|
|
.pagination { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
|
|
|
|
.status { |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
|
|
|
.rate-tip { |
|
|
|
hyphens: auto; |
|
|
|
} |
|
|
|
</style> |